1. Enable the button to be disabled using a script after it is clicked:
Copy codeThe Code is as follows:
<% @ Page Language = "C #" AutoEventWireup = "true" CodeBehind = "WebForm1.aspx. cs" Inherits = "DisableButton. WebForm1" %>
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Title> </title>
<Script type = "text/javascript" src = "Scripts/jquery-1.4.1.min.js"> </script>
<Script type = "text/javascript">
Function enableButton (flag ){
$ ("# BtnTest"). attr ("disabled", flag? "": "Disabled ");
}
$ (Document). ready (
Function (){
$ ("# BtnTest"). click (
Function (){
EnableButton (false); // disabled after clicking
}
);
}
);
</Script>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
<Asp: Button ID = "btnTest" Text = "Disable" runat = "server" OnClick = "Test"/>
</Div>
</Form>
</Body>
</Html>
However, it is a pity that this method does not work: the page will not be sent back. Therefore, we have to look for other methods.
Copy codeThe Code is as follows:
<% @ Page Language = "C #" AutoEventWireup = "true" CodeBehind = "WebForm1.aspx. cs" Inherits = "DisableButton. WebForm1" %>
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Title> </title>
<Script type = "text/javascript" src = "Scripts/jquery-1.4.1.min.js"> </script>
<Script type = "text/javascript">
Function enableButton (flag ){
$ ("# BtnTest"). attr ("disabled", flag? "": "Disabled ");
}
$ (Document). ready (
Function (){
$ ("# BtnTest"). click (
Function (){
EnableButton (false );
$ ("# BtnTest2"). click (); // click an event that disables itself and calls the button that actually triggers sending back.
}
);
}
);
</Script>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
<Input type = "button" value = "Disable" id = "btnTest"/>
<Asp: Button ID = "btnTest2" Text = "Disable" runat = "server" OnClick = "Test" style = "display: none"/>
</Div>
</Form>
</Body>
</Html>
In this way, our goal has been achieved. Finally, we will introduce a method: 3. Using setTimeout to implement
Copy codeThe Code is as follows:
<% @ Page Language = "C #" AutoEventWireup = "true" CodeBehind = "WebForm1.aspx. cs" Inherits = "DisableButton. WebForm1" %>
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Title> </title>
<Script type = "text/javascript" src = "Scripts/jquery-1.4.1.min.js"> </script>
<Script type = "text/javascript">
Function enableButton (flag ){
$ ("# BtnTest"). attr ("disabled", flag? "": "Disabled ");
}
$ (Document). ready (
Function (){
$ ("# BtnTest"). click (
Function (){
SetTimeout (function (){
EnableButton (false );
},
50 );
}
);
}
);
</Script>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
<Asp: Button ID = "btnTest" Text = "Disable" runat = "server" OnClick = "Test"/>
</Div>
</Form>
</Body>
</Html>
In this way, we do not need to introduce any auxiliary controls.
Note: to better observe the test results, you can Sleep several seconds in the button's Click time processing function.
Of course, you can use jquery's unbind and bind functions to remove or add the click event.