Question

可能重复：
  Need to cancel click/mouseup events when double-click event detected
  Preventing double-click of Submit button

我有以下功能

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

}

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

Answer 1

使用

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");
   }
});

Answer 2

设置一个sentinel变量，以防止在ajax请求完成之前对其他点击进行操作：

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

Answer 3

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

点击变量的作用是检查函数当前是否正在运行。

var click = false;
$("#btnSubmit").click(function(){

  if (click == false) {
    click = true;

    $("#btnSubmit").attr("disabled", "disabled");

    //make ajax request

    $("#btnSubmit").removeAttr("disabled");

    click = false;
  }
}

双击即可提交一次

3 个答案: