私のページには、次のようなダミーフォームがあります。
<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()隠しフィールドでは機能するのに他のタイプでは機能しないのか疑問に思っています。