如何防止提交按钮上的双击事件

Question

我的页面中有一个提交按钮.有时当我双击它时,双重提交显然,问题是我将信息保存在数据库中,所以我会在那里有重复的信息,我不希望这样.我尝试了一些类似下面的jquery代码,但它对我不起作用.

这里我的按钮标签是:

<input type="submit" id="btnSubmit" class="btn btn-large btn-success"    style="padding-right:40px; padding-left:40px; text-align:center;">
   

jQuery的:

   $(document).ready(function()
   {
     $('#btnSubmit').dblclick(function()
     {
        $(this).attr('disabled',true);
        return false;
     });
    });  

如何进一步处理？防止默认无法正常工作

$(document).ready(function () {
    alert("inside click");
    $("#btnSubmit").on('dblclick', function (event) {  

       event.preventDefault();

 });
});

Answer 1

使用setTimeout以更加用户友好的方式

$(document).ready(function () {
     $("#btnSubmit").on('click', function (event) {  
           event.preventDefault();
           var el = $(this);
           el.prop('disabled', true);
           setTimeout(function(){el.prop('disabled', false); }, 3000);
     });
});

Answer 2

只需将此方法放入您的表单中，它就会一次性处理双击或多次点击。一旦请求发送，它将不允许一次又一次地发送请求。

 <script type="text/javascript">
            $(document).ready(function(){
                 $("form").submit(function() {
                        $(this).submit(function() {
                            return false;
                        });
                        return true;
                    }); 
            }); 
            </script>