Html() неправильно при изменении входного значения

По сути, у меня есть код, который должен получить 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\[email protected]" + $.now());
                             $("#childsValue").val($("#child").val() + "\r\[email protected]" + $.now());
                         });

Ответ 1