jQuery Form插件 - 如何防止双提交？

在这里有几个线程在SO，但我没有找到一个专门处理我在应用程序中广泛使用的令人敬畏的jQuery Form plugin的线程。jQuery Form插件 - 如何防止双提交？

我希望用户能够点击'submit'一次 - 并禁用'submit'按钮，直到Ajax成功返回JSON字符串。

我试代码是这样的

$('#submit_button').live('click', function(e) { 
e.preventDefault(); 

var options = { 
    type:   'post', 
    dataType:  'json', 
    beforeSubmit: function(){ 
         $('#loading').show().fadeIn(); 
         $('#submit_button').attr('disabled', 'disabled'); 
        }, 
    success:  function(data) { 
          if (data.success === 3) { 
           $('#submit_button').hide(); 
           $('#loading').hide(); 
           $('#validation_message').html(data.message).fadeIn(); 
           $('#submit_button').attr('enabled', 'enabled'); 
          } 
        } 
      } 

$(this).closest('form').ajaxSubmit(options); 
});

但这个堆放“已启用”，并在<button>“已禁用”属性。

<button class="button" id="submit_button" disabled="disabled" enabled="enabled"> Post </button>

对于如何使这项工作有什么建议吗？

来源

2012-06-20 pepe

而不是设置“已启用”属性为“启用”，你会想取消设置为“禁用”属性：$('#submit_button').attr('disabled', '');

HTML不具备的按钮“已启用”属性，所以浏览器是不会用它做任何事 - 它认为它只是一个“垃圾”属性。设置和取消设置“禁用”属性是您所追求的。

来源

2012-06-20 02:24:52 Andrew

尝试：

在成功处理程序

加入这一行..

$('#submit_button').removeAttr('disabled');

删除这条线在成功处理程序：

$('#submit_button').attr('enabled', 'enabled');

来源

2012-06-20 02:25:17 chrisvillanueva

现在不能测试，但使用removeAttr应该帮助（取消在beforeSubmit部分中启用，并在成功中反向）。

来源

2012-06-20 02:25:36

jQuery Form插件 - 如何防止双提交？

回答

相关问题