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

时间:2012-08-07 20:30:44

标签: javascript jquery firefox webkit

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

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

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

如您所见,即使$("#parent").html()$("#child").val()<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> 也不会更新。 为了您的观赏乐趣,这是HTML:

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

...这是JavaScript:

{{1}}

1 个答案:

答案 0 :(得分:14)

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

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

.value仅在输入dirty value flag is false

时反映.defaultValue

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

相关问题