防止按钮多次点击、重复提交【基于Jquery】

在系统开发过程中，可能经常会遇到重复提交的现象。下面是我的解决办法：

一、将系统中提交表单的按钮样式（CSS）设置为submit

<asp:Button ID="Button1" runat="server" Text="立即提交" CssClass="submit"  onclick="Button1_Click" />

 

二、定义CSS样式

 

.submit{
    width:80px; 
    height:22px;
    border:0px; 
    background-image: url(../images/fasan.gif); 
    color:#fff; font-size:12px; line-height:22px;
    text-align:center;
    background-color:#CFE7FD;
}
.submit2{
    width:80px; 
    height:22px;
    border:0px; 
    background-image: url(../images/fasan2.gif); 
    color:#fff; 
    font-size:12px; 
    padding-top:3px;
    text-align:center;
    background-color:#CFE7FD;
}

 

三、JavaScript代码：

 

$(document).ready(function(){
      $(".submit").mouseover(function(){  //change the CSS Button
        $(this).addClass("mail2");}).mouseout(function(){ 
        $(this).removeClass("mail2");});
      
      window.attachEvent('onbeforeunload',function(){$(".submit").val("请等待").attr("disabled","true");});

});

 

四、Button事件

   

protected void Button1_Click(object sender, EventArgs e)
    {


        System.Threading.Thread.Sleep(3000);
        //这里是需要处理的事件
    }