使用 submitHandler 禁用提交按钮

Question

我正在尝试阻止多次单击提交按钮并将同一项目多次上传到 MySQL。

由于验证不起作用，我根本无法按下按钮提交按钮。这意味着我无法测试代码。

我也在发布相关帖子here，为您提供更多信息。

到目前为止，我使用 jQuery 验证：

$("#UploadForm").validate({

errorLabelContainer: "#messageBox",
        wrapper: "td",
        rules: {
            auction_description: {
                required: true
            },
            auction_int_postage_type: {
                required: true
            },
            listing_type: {
                required: true
            }
        }

   //all your options here

   submitHandler:function(form){
       $('#submit').attr('disabled','disabled');
   }
});

HTML

 <form method="post" name="UploadForm" id="UploadForm"
 action="upload.php" enctype="multipart/form-data" >
 
 
 <input style="text-transform:none;"  type="text" class="button_date" 
 name="auction_bin_price" id="auction_bin_price" value="" size="15" />
 
 <input class="button2" style="border-right:none; font-size:13px;"
 name="List Item" id="submit" type="submit" value="List Item"/>
 
 </form>

Answer 1

这是一个 fiddle，其中有一个解决您的问题的工作演示。

jQuery 1.6+

要更改disabled 属性，您应该使用.prop() 函数。

$("#submit").prop('disabled', true);
$("#submit").prop('disabled', false);

jQuery 1.5 及以下

.prop() 函数不存在，但 .attr() 类似：

设置禁用属性。

$("#submit").attr('disabled','disabled');

再次启用

$("#submit").removeAttr('disabled');

在任何版本的 jQuery 中

如果您只处理一个元素，您始终可以依赖实际的 DOM 对象，并且可能比其他两个选项快一点：

// assuming an event handler thus 'this'
this.disabled = true;

使用.prop() 或.attr() 方法的优点是您可以为一组选定的项目设置属性。