我试图在文件上传成功后发送表单,然后清理该表单让用户上传另一个文件,问题是如果我第一次上传,表单会被发送一次,如果我第二次上传,表格会被发送两次,而它应该只发送一次,上传另一个文件第三次,表格发送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,它应该是1,所以我确定事件" queuecomplete"正在被递归地调用。我怎样才能实现我想要的并摆脱这个循环?有没有办法在不破坏我的物体的情况下杀死那个事件?
我正在寻找一种与DropeZone JS无关的通用JS方法
答案 0 :(得分:3)
看起来每次提交某些内容时,外部点击功能都会运行 - 每次外部点击功能运行时,都会在myDropzone
附加一个新的处理程序:
myDropzone.on("queuecomplete",function(file){
您需要在响应发出后删除处理程序,以便后续点击,上传和queuecomplete
不会触发先前附加的处理程序。将处理程序声明为函数并在结尾处使用.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);