JavaScript:创建具有不同名称的表单字段？

Question

我正在使用以下代码创建文件上传输入字段，它运行良好。

但是，我需要像这样重命名它们:

mytext[1]
mytext[2]
mytext[3]

等等等等......

所以我只是将 var i = 0; 放入代码中，然后将 i++ 放入代码中。当我提醒 i 时，我会在提醒框中看到 1、2、3 等，所以我知道这是有效的。

但是这一行是错误的，我不知道如何在这一行中使用 i 变量:

<div><input type="file" name="mytext[i]"/></div>

这是完整的代码:

<script>
$(document).ready(function() {
    var max_fields      = 10; //maximum input boxes allowed
    var wrapper         = $(".input_fields_wrap"); //Fields wrapper
    var add_button      = $(".add_field_button"); //Add button ID
    var i = 0;

    var x = 1; //initlal text box count
    $(add_button).click(function(e){ //on add input button click
        e.preventDefault();
        if(x < max_fields){ //max input box allowed
            x++; //text box increment
            i++
            $(wrapper).append('<div><input type="file" name="mytext[[i]]"/></div>'); //add input box
        }
    });

    $(wrapper).on("click",".remove_field", function(e){ //user click on remove text
        e.preventDefault(); $(this).parent('div').remove(); x--;
    })
});
</script> 

和 HTML 代码:

            <div class="input_fields_wrap">
    <button class="add_field_button">Add More Photos</button>

    <div><input type="file"  name="mytext[]"/></div>
</div>

有人可以就此提出建议吗？

谢谢

Answer 1

您需要将值连接到字符串中，不能只在实际字符串值中添加 i。

另外，不确定为什么你有双方括号[[]]，我想你只需要一套。

试试这个:

$(wrapper).append('<div><input type="file" name="mytext[' + i + ']"/></div>');

Here is a basic example.