不应该保留textarea数据吗？

Question

我在表单中有 textarea ：

<form action="#" id="container">
  <textarea id="txt" cols="100" rows="5">Good bye</textarea>
</form>

我想要的只是用 div 替换这个表单：

$("#container").replaceWith(function() {
    return "<div>" + $(this).html() + "</div>";
});

这没有任何问题，但如果我之前使用 replaceWith 方法更改textarea值：

$("#txt").val("hello world");

最终内容是 div 中的 textarea ，带有“Good bye”文本，而不是预期的“hello world”。你有一个demo here。

为什么会这样？如何用保留textarea内容的 div 替换表单？

Answer 1

.val()正在更改textarea的值（表示提交表单时发送的数据），不一定是其内部文本/ HTML ..这样做使用.html()代替：

$("#txt").html("hello world"); 

Updated jsFiddle

Answer 2

尝试这一个，（改为使用.html()）（html()插入值，而textarea，.val()则没有）

http://jsfiddle.net/kRGqR/5/

Answer 3

This works:

$("#txt").val("hello world");
$("#container").replaceWith(function() {
    return $('<div />').append($(this).contents());
});

问题在于使用.html()序列化html。在DOM节点方面工作要好得多。这也将保留事件处理程序。

---

这是另一种方式：

$('#container').wrapInner('<div/>').children().unwrap();