javascript - 如何在动态创建的输入类型 'file' 上触发单击事件？

Question

我正在尝试将"file"类型的输入动态添加到表单中。实际上，最终用户可以向表单添加任意数量的文件，因此需要一个数组概念。我可以注入(inject)动态元素，但我不知道如何动态调用刚刚注入(inject)的输入元素的单击。另外，如果用户在输入元素上选择取消，则需要删除动态元素。

我创建了一个jsfiddle显示注入(inject)，但运行触发器时单击事件永远不会触发。

注入(inject)此元素后如何触发“click”事件？

jsFiddle Html

<input id='button1' type='button' value='button1'>
<div class='container'>

</div>

jsFiddle JavaScript

$(document).ready(function () {
    $('#button1').on('click', function(event) {
    Button1_Click(event);
  });
});

function Button1_Click(event) {
    var container = $('.container');
  var containerChildren = $(container).children();
  var containerChildrenCount = $(containerChildren).length;
  var inputId = 'fileInput[' + containerChildrenCount + ']';
    $('.container').append('<input id="' + inputId + '" type="file" />');
  $('#' + inputId).trigger('click');
}

Answer 1

尝试从 inputId 变量中删除 []。

我把它改成这样，让它在你的 fiddle 中工作

var inputId = 'fileInput-' + containerChildrenCount