双击时仅提交一次

Submit only once on double click

本文关键字：一次 提交 双击      更新时间：2023-09-26

可能的重复项：
检测到
双击事件时需要取消单击/鼠标向上事件 防止双击"提交"按钮

我有以下功能

$("#btnSubmit").click(function(){
                $("#btnSubmit").attr("disabled", "disabled");
          ....make ajax request
              $("#btnSubmit").removeAttr("disabled");
}

问题是我想处理双击的第一次单击。或单击.因为当用户双击时，它确实会运行该功能两次。如果我使用 .one（），它只会处理一次点击。但是我也想处理双击，但只处理一次.有什么解决方案？

使用

dblclick()

而不是click()

阅读更多 关于 .dblclick()

您的代码应如下所示

$("#btnSubmit").dblclick(function(){
   $("#btnSubmit").attr("disabled", "disabled");
   $("#btnSubmit").removeAttr("disabled");
});

您可以使用标志

var alreadyClicked = false;
$("#btnSubmit").click(function(){
   if(alreadyClicked) {
      alreadyClicked = false;
      return false;
   } else {
     alreadyClicked = true;
     $("#btnSubmit").attr("disabled", "disabled");
     $("#btnSubmit").removeAttr("disabled");
   }
});

设置一个哨兵变量以防止在 ajax 请求完成之前对进一步的点击进行操作：

var clicked = false;
$("#btnSubmit").click(function(){
    if (clicked) {
        return;
    } else {
        clicked = true;
    }
    $.ajax({
      success: function() {
          clicked = false;
    });
});

我的解决方案将在按下按钮时停止双击检查变量。

发生的情况是，单击变量用作检查函数当前是否正在运行。

var click = false;
$("#btnSubmit").click(function(){
  if (click == false) {
    click = true;
    $("#btnSubmit").attr("disabled", "disabled");
    //make ajax request
    $("#btnSubmit").removeAttr("disabled");
    click = false;
  }
}
相关文章：