jQuery - результаты манипулирования DOM не могут быть присвоены переменной?

Question

Используя jQuery, я изменяю значение поля ввода текста через какой-то процесс.После завершения процесса мне нужно зафиксировать это изменение и применить его к другому процессу.Моя проблема в том, что я не могу зафиксировать это изменение и присвоить его переменной.Я знаю, что изменения происходят, потому что DOM обновляется.Кроме того, это назначение переменных работает в IE, но не для других протестированных мною браузеров.

Ниже приведен фрагмент, подтверждающий мою точку зрения (и вы можете увидеть его здесь: http://jsfiddle.net/xMwAE/).

<form>
    <input type="hidden" name="my_hidden" value="Hidden Field" />
    <input type="text"   name="my_text"   value="Text Field"   />
</form>


$().ready(function() {
    $('input[name=my_hidden]').val('Hello Hidden Field');
    $('input[name=my_text]').val('Hello Text Field');

    // Display
    var temp = $('form').html();

    // Though the DOM is updated with the new values. The variable temp
    // does not capture the changes to the input text field, but captures
    // the change in the hidden field. When in IE, temp captures the 
    // changes in both fields.
    alert(temp);
});

Очевидно, мне нужно согласованное поведение в разных браузерах. Есть идеи, что происходит?

Answer 1

Я не понимаю, что происходит, но каким-то образом должна быть разница между установкой значения в качестве члена (input.value) или установкой значения в качестве атрибута-узла.

Это работает для меня:

$('input[name=my_text]').each(function()           
{ this.setAttribute('value','Hello Text Field');});

Я думаю, это ошибка в innerHTML, см. Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=535992

Answer 2

Кроме того, вы можете хранить значения ваших полей в массиве и использовать их так, как вам нравится:

var data = [];
$('form :input').each(function(){
  data.push(this.value);
});

Теперь вы можете проверять значения следующим образом:

alert(data[0]);
alert(data[1]);