Question

我尝试使用JS按钮添加更多输入，但无法弄清楚。

所以，我在我的HTML中有这个代码：

 <div id="ingredients" class="ingredients">
      <h2 class="tk-freight-sans-pro">Ingredients</h2>
      <input type="text" placeholder="Ingredient">
      <input type="text" placeholder="Ingredient">
      <input type="text" placeholder="Ingredient">
      <br>
      <button class="button" onclick="addIngredient();">Add Ingredient</button>
    </div>

我的JS在这里：

function addIngredient() {
        var list = document.getElementById("ingredients")
        list.innerHTML += "<input type="text" placeholder="Ingredient">"
     }

有谁知道发生了什么或我需要做什么？谢谢！

Answer 1

此：

list.innerHTML += "<input type="text" placeholder="Ingredient">"

应该是这样的：

list.innerHTML += "<input type=\"text\" placeholder=\"Ingredient\">"

或者那样：

list.innerHTML += '<input type="text" placeholder="Ingredient">'

您不能在双引号括起来的字符串中使用双引号。你必须转义字符串中的引号或使用简单的引号来包装它。

此外，您应该在每条指令后加上;。

使用JS添加更多输入

1 个答案: