在我的页面上，我有一个像这样的虚拟表格：
<div id="form_container">
<form id="new_form" action="...">
<input type="hidden" id="hidden_field" name=...>
<input type="text" id="text_field" name=...>
<... submit button ...>
</form>
</div>
输入值最初为空白。
我需要不时在我的页面上使用字段中的不同值重新创建此表单。我做什么：首先我将表单容器从 DOM 中分离出来并将其存储在一个变量中：
var dummyForm = $('#form_container').detach();
然后，当我需要弹出表单时，我会执行一些功能：
var newForm = dummyForm .clone()
$('#hidden_field', newForm).val(dataForHidden);
$('#text_field', newForm).val(dataForText);
然后newForm通过将其附加到页面上的某个元素来使其可见。
但是当我检查输入的结果 html（或者我只是newForm.html()在 JS 调试器中检查）时，它看起来像这样：
<input type="hidden" id="hidden_field" name=... value="xxx">
<input type="text" id="text_field" name=...>
即设置了隐藏字段的值，但对于文本字段，它会丢失。
我的问题是：1）这是一个错误、已知问题、设计功能，还是我做错了什么？2）如何解决？
当表单已经附加到 DOM 时，我可以考虑填写字段值的解决方案，但在我的情况下，这可能是一个问题，因为它是由另一个库通过一些回调链附加到 DOM 的。
PS我能够通过这样做来解决这个问题，$('#text_field', newForm).attr('value', dataForText);但仍然想知道为什么val()适用于隐藏字段而不适用于其他类型。