asp.net下按鈕點擊后禁用的實現代碼

2020-01-18 00:45:47

字體：大中小

來源：轉載

供稿：網友

一、讓按鈕在點擊后用腳本使其禁用：

 
<%@ 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 );//點擊后禁用 
} 
); 
} 
); 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<asp:Button ID="btnTest" Text="點擊后禁用" runat="server" OnClick="Test" /> 
</div> 
</form> 
</body> 
</html> 

然而事實很遺憾的告訴我們這種方式行不通：頁面根本不會回發。于是，我們不得不尋找其他方式。

復制代碼代碼如下:

 
<%@ 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事件 
} 
); 
} 
); 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<input type="button" value="點擊后禁用" id="btnTest" /> 
<asp:Button ID="btnTest2" Text="點擊后禁用" runat="server" OnClick="Test" style="display:none"/> 
</div> 
</form> 
</body> 
</html> 

這樣一來我們的目的達到了。最后再介紹一種方式：三、利用setTimeout實現

復制代碼代碼如下:

 
<%@ 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="點擊后禁用" runat="server" OnClick="Test"/> 
</div> 
</form> 
</body> 
</html> 