为什么我在添加内容后使用方法＆＃39; jQuery点击事件＆＃39;不行

Question

这里我使用jQuery版本3.1.1，为什么我使用这种方法不起作用？

＆＃13;

＆＃13;

$('input[name="images-post[]"').on("click", 'input[name="images-post[]"]', function() {
  $('.menu-create-post .mdi-camera').append('<input type="file name="images-post[]" accept="image/*" multiple="multiple">');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div class="wrapper">
  <span class="span-wrapper" style="display: inline-block;">
    <input type="file" name="images-post[]"/>
  </span>
</div>

＆＃13;

＆＃13;

＆＃13;

请更正错误：D

Answer 1

您的代码中有多处错误。

1. 直播活动必须绑定到静态元素，因此$(static).on('event', dynamic, function () {})

2. 您没有尝试将输入元素附加到的元素。

3. 在append

之后，您的"遗失type="file

4. 使用domReady

＆＃13;
＆＃13;
$(document).ready(function() {
  $(document).on("click", 'input[name="images-post[]"]', function() {
    $('.menu-create-post .mdi-camera').append('<input type="file" name="images-post[]" accept="image/*" multiple="multiple">');
  });
});
＆＃13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div class="wrapper">
  <span class="span-wrapper" style="display: inline-block;">
    <input type="file" name="images-post[]"/>
  </span>
</div>
<div class="menu-create-post">
  <div class="mdi-camera"></div>
</div>
＆＃13;
＆＃13;
＆＃13;

Answer 2

您还可以为点击创建绑定事件，并在需要时随时调用它。

function bindClick(){
     $('input[name="images-post[]"').unbind();
     $('input[name="images-post[]"').bind("click", 'input[name="images-post[]"]', function() {
         $('.menu-create-post .mdi-camera').append('<input type="file name="images-post[]" accept="image/*" multiple="multiple">');
     });
}