Warum ändert sich diese Umwandlung nicht?

Question

$('li').click(function() { 
    $(this).replaceWith('<form><input[type="text"]>cool stuff</input></form>'); 
}); 

Wenn ich diesen Code verwende, erscheint der Text in der Mitte, aber nicht das Textfeld, das ich suche. Wie behebe ich das?

Answer 1

Es ist, weil die HTML Sie die li sind ersetzt mit ist ungültig:

$('li').click(function() { 
    $(this).replaceWith('<form><input type="text">cool stuff</form>'); 
}); 

Working example

Beachten Sie auch, dass bei einem form ein li ersetzt ungültig ist, als nur li Elemente direkter Kinder sein können a ol oder ul. Stattdessen könnten Sie die aktuellen li, dann append() die neuen form es empty(), oder einfach nur html(), dies zu tun:

$('li').click(function() { 
    $(this).html('<form><input type="text">cool stuff</form>'); 
});