javascript - 如何使用输入字段创建按钮？

Question

所以我试图让用户在输入字段中输入一个数字，当他们单击提交按钮时，它将创建他们放入输入字段的按钮数量。例如，他们在输入字段中输入“4”，点击提交按钮，它将创建 4 个按钮。

我对段落做了同样的事情。代码在这里：

function submit()
{
    if(!isFinished)
    {

        var choice = parseInt(document.getElementById("paragraphs").value);

        if(choice > 0 && choice <= 5)
        {
            var para = document.getElementById("paragraphs").value;
            var container = document.getElementById("container");

            while (container.hasChildNodes()) 
            {
                container.removeChild(container.lastChild);
            }
        
            for (i = 0; i < para; i++)
            {                
                container.appendChild(document.createTextNode("Paragraph Number " + (i+1)));
                var input = document.createElement("input");
                input.type = "text";
                container.appendChild(document.createElement("br"));
            }
    
            console.log(para + " paragraphs were created.")
        }
    }
}

我将如何对按钮做同样的事情？

标签： javascriptuser-input

Answer 1

同意大卫，问题需要更多细节。希望以下内容可以帮助您指出正确的方向！:)

function submit(e) {
  e.preventDefault();
  
  var choice = document.getElementById("paragraphs").value;
  var container = document.getElementById("container");
  
  // clear container buttons
  container.innerHTML = "";
  
  // add buttons
  for (var i = 0; i < choice; i++) {
    var button = document.createElement('button');
    button.innerHTML = "Button " + i;
    container.appendChild(button);
  }
}

https://jsfiddle.net/9kufoev1/