5

我最初希望在单击事件上进行提交：

    $("#booking_Form #submit_Booking").bind("click", function(event){.....

然后我发现（显然）双击导致重复提交。

所以我尝试通过以下方式捕获和抑制它：

    $("#booking_Form #submit_Booking").bind("dblclick", function(event){
          return false;
    });

但是单击事件仍然触发了两次。

我是否更正它认为如果双击不提交两次是必须的，我必须将单击事件更改为双击事件。

还是有一些全局方法可以关闭双击。

4

6 回答 6

7

你应该使用.one(). 这样所有后续点击都不会执行任何操作

$("#booking_Form #submit_Booking").one("click", function(event) {
    //do something
});

链接：http ://api.jquery.com/one/

编辑：如果你想使用.one()，如何做这样的事情......

JAVASCRIPT：

$(document).ready(function(){
     $("#b1").one("click", function(e){
        ajaxFunction();
     });   

    function ajaxFunction(){
         $("#b1").one("click", function(e){
             ajaxFunction()
         });

        $.ajax({
            type: "POST",
            url: "http://fiddle.jshell.net/", //use actual URL
            success: function(data){
               //do something    
            }
        });           
    }
});​

演示：http: //jsfiddle.net/BKqm9/13/

于 2012-12-03T15:44:29.637 回答
4

只需在单击处理程序中禁用您的输入，这样用户就不能再次单击，当您完成单击处理程序中的逻辑时，您将再次启用它。因此，您可以执行以下操作：

$("#booking_Form #submit_Booking").bind("click", function(event){
   $(this).attr('disabled','true');
   ...
   ...
   var btn = $(this);
   $.ajax('someurl.php',{success: function(){
          ...
          ...
          btn.removeAttr('disabled');
    }
   })
}
于 2012-12-03T15:34:46.950 回答
2

您可以将其包装在闭包中并使用脏标志变量。（关闭所以标志不是全局的）

(function(){
    var dirtyFlag = false;
    $('#clicker').click(function(){
        if (dirtyFlag) return;
        dirtyFlag = true;
        setTimeout(function(){
            console.log('clean and proceeding');
            dirtyFlag = false;
        }, 500);
    });
})();​

在这里拉小提琴。由于禁用按钮不是一个选项，这是 IMO 最干净和最简单的解决方案。

于 2012-12-03T15:54:39.017 回答
1

如果你想要排队方法，试试这样的：（只是一个模型）

$('<div>').clearQueue('buttonQueue');

$("#booking_Form #submit_Booking").bind("click", function(event) {
    $('<div>').clearQueue('buttonQueue');
    $('<div>').queue('buttonQueue', myFunctionHere());
});

把它放在 DocumentReady 函数中应该没问题。

于 2012-12-03T15:46:21.113 回答
1

这可能会有所帮助：

$("#booking_Form #submit_Booking").bind("click", function(e) {

    // custom handling here
    e.preventDefault();
    e.stopPropagation();
}​

试试看。

于 2012-12-03T15:55:02.663 回答
0

在执行逻辑之前，您可以在单击后禁用按钮，在执行代码后，您可以启用按钮单击事件。这很简单- 

$("#saveOrder").attr("disabled", true);

你的逻辑在这里 

$("#saveOrder").attr("disabled", false);
于 2019-03-14T04:22:54.803 回答