Question

我正在使用javascript编写程序来进行多种数据设置。但是我根据输入的输入字段数量在代码中停留了多个输入文件。

function createTextFields(nom) {
  alert(nom);
  var count = nom;
  for (var l = 0; l < count.length; l++) {
    document.getElementById('formSet').innerHTML = '<input type="text" class="form-control" name="textField_' + l + '" id="textField_' + l + '" required>';
  }
}

Answer 1

您可以使用+=将新的input附加到form。

＆＃13;

createTextFields(10);

function createTextFields(nom) {
  var count = nom;
  for (var l = 0; l < count; l++) {
    document.getElementById('formSet').innerHTML += '<input type="text" class="form-control"  placeholder="textField_' + l + '" name="textField_' + l + '" id="textField_' + l + '" required><br/>';
  }
}

＆＃13;

<form id="formSet"> </form>

＆＃13;

注意： count.length条件中的for代替count我只放Number，因为您说＆＃34;输入数字＆＃34;并且length没有Customers (id, username, password, fullname, email)财产。

Answer 2

我建议您不要使用innerHTML。而是创建新元素并为其添加属性。正如我在下面说明的那样：

function createTextFields(nom)
        {
            alert(nom);
            var count = nom;
            for(var l = 0; l<count.length;l++)
            {
//              document.getElementById('formSet').innerHTML = '<input type="text" class="form-control" name="textField_'+l+'" id="textField_'+l+'" required>';
                var input = document.createElement("INPUT");    
                input.setAttribute("type", "text");
                input.setAttribute("class", "form-control");
                input.setAttribute("name", "textField_"+l);
                input.setAttribute("id", "textField_"+l);
                input.setAttribute("required", true);
                document.getElementById('formSet').appendChild(input);
            }

        }

Answer 3

<script>

// call funciton createTextFields 
createTextFields(10);

 function createTextFields(nom)
{
    // nom will be a number of elements to be added
    var count = nom;

    var k = new Array();

    for(var l = 0; l <count; l++)
    {
        // push into array
        k.push('<input type="text" class="form-control" name="textField_'+l+'" id="textField_'+l+'" required>');

    }
    // insert those childs to the formset and by joining the array
    // of textfield
    document.getElementById('formSet').innerHTML = k.join('');

}

</script>

根据您的需要随意修改代码

使用Javascript在单个div中添加多个输入字段

3 个答案: