当输入值已更改时,html() 方法错误

html() method wrong when input value has changed

本文关键字:html 方法 错误 输入      更新时间:2023-09-26

本质上,我有一些代码需要在其任何输入元素模糊时获取父元素的 HTML。这很简单。问题是在父元素上调用html()时返回的 HTML 不反映其中包含的输入元素的当前值。也就是说,在Firefox或Chrome中。它适用于所有地方的IE。

这是JSFiddle:http://jsfiddle.net/8PJMx/15/

尝试将文本框中的"世界"更改为"所有人",然后单击按钮。请注意,我还附加了$.now(),以便您可以看到代码实际上正在执行。

如您所见,$("#parent").html()不会更新,即使$("#child").val()更新也是如此。为了您的观看乐趣,以下是 HTML:

<div id="parent">Hello <input type='text' id="child" value='world' /></div>
<button id="separateEvent">Get HTML.</button>
<br>
<p>The HTML for #parent is:</p>
<textarea id="parentsHtml" style="width:95%; height: 100px;"></textarea>
<p>The value of #child is:</p>
<textarea id="childsValue" style="width:95%; height: 100px;"></textarea>

。这是JavaScript:

$("#separateEvent").click(function ()
                         {
                             $("#parentsHtml").val($("#parent").html() + "'r'n@" + $.now());
                             $("#childsValue").val($("#child").val() + "'r'n@" + $.now());
                         });
html

value=""属性不反映 .value DOM 属性(不直观),但它反映的是 .defaultValue DOM 属性。.value属性未序列化为 HTML,但.defaultValue序列化为。

用户输入更改.value,而不是.defaultValue

.value仅反映当输入的脏值标志为 false 时的.defaultValue

下面是一个解决方法,其中还包括 SELECT 框的示例:http://jsfiddle.net/8PJMx/20/