Javascript 如果用户在未选择文件的情况下打开和关闭输入文件，如何防止加倍输入文件

我想当用户选择一个文件时，会创建另一个输入文件，但使用我的代码，当用户打开并关闭文件而不选择文件时，他会再次打开并选择一个文件。如果他打开和关闭3次，则会创建2个输入，然后选择一个文件，则会创建4个输入。 如果他第一次选择了一个文件，则只创建了1个

<div class="gal-stf">
    <input class="plus-n" type="file">
      <p class="bt"></p>
  </div>
      <div class="ad-photo" style="display: none;">

      <div class="gal-stf">
    <input class="plus-n" type="file">
          <p></p>
  </div>
          </div>

---

实际上，这是因为每次单击时都要绑定事件处理程序，所以

3

click意味着3个不同的处理程序，每个处理程序都会在发生更改事件时触发。单击事件直接使用事件委派侦听更改事件，而不是侦听

$（“.gal”）.on（“change”，“.plus-n”，函数（）{
$（'.gal'）.append（$（'.ad photo.gal stf'）.last（）.clone（false））；
$（this.prop（'disabled'，'disabled'）；
$（this.this（'p'）.text（this.value）；
});





$(".gal").on("click", ".plus-n", function () {

              var el = $(this).val();
              $(this).change(function () {
        $('.gal').append($('.ad-photo .gal-stf').last().clone(false));
                  $(this).prop('disabled' , 'disabled');
                  $(this).siblings('p').text(this.value);
      });
    });