如何不递归触发事件?

How to not fire an event recursively?

我试图在文件上传成功后发送一个表单,然后清理该表单让用户上传另一个文件,问题是如果我第一次上传,表单只发送一次,如果我第二次上传,表格发送了两次,而应该只发送一次,第三次上传另一个文件,表格发送了 3 次。

我希望每当用户上传新文件时发送一次表单,无论他上传多少次。

这是我的代码:

 $("#send-pc").off('click').on("click",function(){
      var data = {};
        console.log('hi')
        myDropzone.processQueue()
        test_cpt = 0;
        myDropzone.on("queuecomplete",function(file){
          $("#form-pc").serializeArray().map(function(x){data[x.name] = x.value;})
          data["filename"] = myDropzone.files[0].name
          data["token"] = oauthToken
          console.log(data["filename"])
          test_cpt = test_cpt + 1
          $.post("/add-docs-pc",data).done(function(resp){
          if(resp == "200"){
            alert("Vos documents on été ajouté à la platforme")
            reset_form()
            myDropzone.removeFile(file)

          }
          else{
            console.log("ERROR")
          }
          })
        });//queuecomplete Callback

      });

当我第二次上传另一个文件时检查test_cpt它是2,它应该是一个,所以我确定事件"queuecomplete"正在被递归调用。我怎样才能实现我想要的并摆脱这个循环?有没有办法在不破坏我的对象的情况下终止该事件?

我正在寻找与 DropeZone JS 没有特别相关的通用 JS 方法

看起来每次提交内容时,外部点击功能都会运行 - 每次外部点击功能运行时,新的处理程序都会附加到 myDropzone 此处:

myDropzone.on("queuecomplete",function(file){

您需要在发送响应后删除处理程序,以便后续的点击、上传和 queuecompletes 不会触发之前附加的处理程序。将处理程序声明为函数并在末尾使用 .off,或者简单地使用 jQuery 的 .one,以便处理程序在调用后自动解除绑定:

function queueCompleteHandler(file) {
  $("#form-pc").serializeArray().map(function(x){data[x.name] = x.value;})
  data["filename"] = myDropzone.files[0].name
  data["token"] = oauthToken
  console.log(data["filename"])
  test_cpt = test_cpt + 1
  $.post("/add-docs-pc",data).done(function(resp){
    if(resp == "200"){
      alert("Vos documents on été ajouté à la platforme")
      reset_form()
      myDropzone.removeFile(file)

    }
    else{
      console.log("ERROR")
    }
  });
  // Remove the handler if you used `on` instead of `one`:
  // myDropzone.off("queuecomplete", queueCompleteHandler);
}

myDropzone.one("queuecomplete", queueCompleteHandler);