Javascript 使用JS的多个输入字段

获得以下JS代码：

<script language="javascript">
fields = 0;
pNR = 0;
err = 0;

function addInput() {
    if (fields != 40) {
        document.getElementById('text').innerHTML += "<input type='text' name='first" + pNR + "' value='' /><input type='text' name='second" + pNR + "' value='' /><br />";
        fields += 1;
        pNR += 1;
    } else {
        if (err == 0) {
            document.getElementById('text').innerHTML += "<br />Adaugati maxim 40 ingrediente.";
            err = 1;
        }
        document.form.add.disabled = true;
    }
}
</script>

字段=0；
pNR=0；
误差=0；
函数addInput（）{
如果（字段！=40）{
document.getElementById（'text'）.innerHTML+=“
”；
字段+=1；
pNR+=1；
}否则{
如果（错误==0）{
document.getElementById（'text'）.innerHTML+=“
Adaugati maxim 40 Ingredite。”；
误差=1；
}
document.form.add.disabled=true；
}
}

以及以下HTML：

<input name="name" style="color:#ffffff;" class="name required" type="button" onclick="addInput()" value="Add" />   

<div id="text">
</div>

---

默认情况下，没有字段。当我按下Add按钮（字段以不同的名称逐个添加）时，填充字段并再次单击Add按钮，填充的字段将清空。我做错了什么

您并不是简单地添加新的输入

你是：

• 将现有值转换为HTML（value属性不变，它仍将具有默认值，而不是当前值）
• 为新输入添加HTML
• 从该HTML生成新的DOM元素

不要使用

innerHTML

。使用

createElement

、

appendChild

和好友

---

这：

document.getElementById('text').innerHTML += "<input type='text' name='first" + pNR + "' value='' /><input type='text' name='second" + pNR + "' value='' /><br />";

对于

else

情况：

var text = document.getElementById("text");
text.appendChild(document.createElement("br"))
text.appendChild(document.createTextNode("Adaugati maxim 40 ingrediente."));

工作示例：

请参见以下内容：

var text = document.getElementById("text");
text.appendChild(document.createElement("br"))
text.appendChild(document.createTextNode("Adaugati maxim 40 ingrediente."));