1

以下のフォームは、1 つのことを除いて、私が望むように機能しています。「追加」リンクをクリックすると、すべてのテキストボックスのテキストが、画像に見られるようにデフォルト値に戻ります。どうすれば修正できますか？ありがとう。

クリック前:

最初の画像

「追加」をクリックした後：

2番目の画像

コード： 

function addSection() {
    var str = '<div>' + 
                '<input type="text" name="composer" value="Compositor" />' + 
                '<input type="text" name="peca" value="Peca" size="40" />' + 
                '<input type="button" value="x" style="width: 26px" onclick="delSection(this)" /><br />' + 
            '</div>';

    document.getElementById("programa").innerHTML += str;
}

function delSection(field) {
    field.parentNode.outerHTML = "";
}

window.onload = addSection;

</script>
<fieldset>
    <legend>Programa</legend>
    <div id="programa">
    </div>
    <a href="#" onclick="addSection()" >Add</a><br />
</fieldset>
<input type="submit" value="Inscrever Aluno" name="submit" />
4

3 に答える 3

1

を使用して、これを克服できますappendChild()

JS

function newSet() {
    var div = document.createElement("div");   

    var composer = document.createElement("input");
    composer.type="text";
    composer.value = "Compositer";

    var peca = document.createElement("input");
    peca.type = "text";
    peca.value = "Peca";

    var button = document.createElement("input");
    button.type = "submit"

    div.appendChild(composer);
    div.appendChild(peca);
    div.appendChild(button);

    return div
}

function addSection() {    
    document.getElementById("programa").appendChild(newSet());
}

デモ

于 2012-04-06T10:27:20.577 に答える
1

これは、新しい要素を挿入するための正しい JS です。

function addSection() {
    var newDiv = document.createElement('div');
    var str =   '<input type="text" name="composer" value="Compositor" />' + 
                '<input type="text" name="peca" value="Peca" size="40" />' + 
                '<input type="button" value="x" style="width: 26px" onclick="delSection(this)" /><br />';
    newDiv.innerHTML = str;
    document.getElementById("programa").appendChild(newDiv);
}

要素の命名（または識別）の解決策を見つけて、要素を削除できるようにする必要がありますdelSelection(field)

于 2012-04-06T10:29:21.057 に答える
0

のような名前を作成しname="composer[]"ますname="peca[]"

上記のコードの実装方法がわからない場合は、

http://www.randomsnippets.com/2008/02/21/how-to-dynamically-add-form-elements-via-javascript/

于 2012-04-06T10:19:39.237 に答える