0

私はしばらくこの問題を抱えていて、私を夢中にさせてきました! サイトがクラッシュしたり使用できなくなったりするわけではありませんが、それでも腹立たしいです。ユーザーがフォーム内の任意の回答に対して最大 10 個の質問を作成できるタグと、別の回答を追加できる JavaScript ボタンがあります。私が抱えている問題は、ボタンでいくつかの回答テキストフィールドを追加して入力すると、ボタンで別の回答を追加しようとすると、送信したばかりのすべての回答が上書きされることです! jsfiddle へのリンクはhttp://jsfiddle.net/EkUmG/であり、関連する実際の html ドキュメントのコードを次に示します (ファイル全体を含めますが、その上に php があるため、ドラッグ アンド ドロップするだけではできません)。とにかくブラウザに）

  • 事前に助けてくれてありがとう

ここにhtmlがあります

<div id='buttons'></div>

（そして、はい、そのdivの不適切な名前であることを認識しています。申し訳ありません）

そしてここにjavascriptがあります

<script type="text/javascript">
    var answers = 0;
    var inHTML = "";
    function addAnswer()
    {
       if(answers < 10){
       write = document.getElementById('buttons');
       write.innerHTML = write.innerHTML + "answer: <input type=\"text\" name=\"answer"    + answers + "\" /> <br>";
       answers = answers + 1;}
    }
</script>
4

2 に答える 2

3

innerHTMLプロパティに書き込むことにより、ブラウザにすべてのコンテンツを再解析させ、入力フィールドの値をリセットします。

代わりに、insertAdjacentHTML（デモ）を使用してください。

このメソッドは、バージョン8以降のFFでのみサポートされていることに注意してください。より低いバージョンをサポートする必要がある場合は、このポリフィルを使用するか、@Stanoのソリューションを使用できます。

于 2012-07-27T14:34:40.577 に答える
2

innerHTML 以外の代替 DOM メソッドを使用できます。

function addAnswer() {
    if (answers < 10) {
        write = document.getElementById('buttons');
        var answer = document.createElement('input');
        answer.type = "text";
        answer.name = "answer" + answers;
        write.appendChild(document.createTextNode('answer: '));
        write.appendChild(answer);
        write.appendChild(document.createElement('br'));
        answers = answers + 1;
    }
}

フィドル

于 2012-07-27T14:42:12.930 に答える