Button、LinkButton和ImageButton
ASP.NET Framework包含三個用於向伺服器端提交表單的控制元件：Button、LinkButton和ImageButton。這三個控制元件擁有同樣的功能，但每種控制元件的外觀介面不同。
本節學習如何在頁面中使用這三種控制元件。然後，學習如何關聯客戶端指令碼和伺服器端Button控制元件，以及如何使用Button控制元件把一個表單傳到不是當前頁的頁面。最後，學習如何處理Button控制元件的Command事件。
一、使用Button控制元件
Button控制元件用來向伺服器端提交表單的按鈕。例如，程式碼清單1中的頁面包含一個Button控制元件。點選這個Button控制元件，則更新由
程式碼清單1ShowButton.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head id="Head1" runat="server">
<title>Show Button</title>
</head>
<form id="form1" runat="server">
<div>
<asp:Button id="btnSubmit" Text="Submit" OnClick="btnSubmit_Click" Runat="server" /> <br /><br />
<asp:Label id="lblTime" Runat="server" />
</div>
</form>
圖1顯示Button控制元件
Button控制元件支援下列屬性（不完全列表）：
·AccessKey——指定一個導向Button控制元件的鍵。
·CommandArgument——用於指定傳給Command
·CommandName——指定傳給Command事件的命令名。
·Enable——用於禁用該Button控制元件。
·OnClientClick——指定點選按鈕時執行的客戶端指令碼。
·PostBackUrl——用於設定將表單傳給某個頁面。
·TabIndex——設定Button控制元件的Tab順序。
·Text——用於標註Button控制元件。
·UseSubmitBehavior——用於使用JavaScript回傳表單。
Button控制元件支援下面的方法：
·Focus()——用於把初始表單焦點設為該Button控制元件。
Button控制元件還支援下面兩個事件：
·Click——點選Button控制元件時引發。
·Command——點選Button控制元件時引發。CommandName和CommandArgument傳給這個事件。
二、使用LinkButton控制元件
LinkButton控制元件象Button控制元件一樣，用於把表單回傳給伺服器端。但是，不像Button控制元件生成一個按鈕，LinkButton控制元件生成一個連結。
程式碼清單2包含了一個簡單的表單。這個表單包含一個LinkButton控制元件，用於向伺服器端提交表單並顯示錶單欄位的內容（見圖2）。
程式碼清單2ShowLinkButton.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head id="Head1" runat="server">
<title>Show LinkButton</title>
</head>
<form id="form1" runat="server">
<div>
<asp:Label id="lblFirstName" Text="First Name:" AssociatedControlID="txtFirstName" Runat="server" /> <br />
<asp:TextBox id="txtFirstName" Runat="server" /><br /><br />
<asp:Label id="lblLastName" Text="Last Name:" AssociatedControlID="txtLastName" Runat="server" /><br />
<asp:TextBox id="txtLastName" Runat="server" /><br /><br />
<asp:LinkButton id="lnkSubmit" Text="Submit" OnClick="lnkSubmit_Click" Runat="server" /><br /><br />
<asp:Label id="lblResults" Runat="server" />
</div>
</form>
圖2 顯示LinkButton控制元件
在後臺，LinkButton控制元件使用JavaScript把表單傳回伺服器端。LinkButton控制元件生成這樣的超連結：
<a id="lnkSubmit" href="javascript:__doPostBack('lnkSubmit','')">Submit</a>
點選LinkButton呼叫把表單傳回伺服器端的JavaScript _doPostBack()方法。當提交表單時，所有表單欄位的值也被傳回給伺服器端。
LinkButton控制元件支援下列屬性（不完全列表）：
·AccessKey——指定一個導向LinkButton控制元件的鍵。
·CommandArgument——用於指定傳給Command事件的命令引數。
·CommandName——指定傳給Command事件的命令名。
·Enable——用於禁用該LinkButton。
·OnClientClick——指定點選LinkButton時執行的客戶端指令碼。
·PostBackUrl——用於設定將表單傳給某個頁面。
·TabIndex——設定LinkButton控制元件的Tab順序。
·ext——用於標註LinkButton控制元件。
Button控制元件支援下面的方法：
·ocus()——用於把初始表單焦點設為該LinkButton控制元件。
Button控制元件還支援下面兩個事件：
·lick——點選LinkButton控制元件時引發。
·ommand——點選LinkButton控制元件時引發。CommandName和CommandArgument傳給這個事件。
三、使用ImageButton控制元件
ImageButton控制元件類似Button和LinkButton控制元件，用於把表單傳回伺服器端。只是ImageButton控制元件總是顯示圖片。
程式碼清單3 中的頁面包含一個ImageButton控制元件，它把一個簡單的表單傳回伺服器端（見圖3）。
程式碼清單3ShowImageButton.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head id="Head1" runat="server">
<title>Show ImageButton</title>
</head>
<form id="form1" runat="server">
<div>
<asp:Label id="lblFirstName" Text="First Name:" AssociatedControlID="txtFirstName" Runat="server" /><br />
<asp:TextBox id="txtFirstName" Runat="server" /><br /><br />
<asp:Label id="lblLastName" Text="Last Name:" AssociatedControlID="txtLastName" Runat="server" /><br />
<asp:TextBox id="txtLastName" Runat="server" /><br /><br />
<asp:ImageButton id="btnSubmit" ImageUrl="Submit.gif" AlternateText="Submit Form" Runat="server" OnClick="btnSubmit_Click" /><br /><br />
<asp:Label id="lblResults" Runat="server" />
</div>
</form>
圖3顯示ImageButton控制元件
程式碼清單3中的ImageButton控制元件包含ImageUrl屬性和AlternateText屬性。ImageUrl屬性包含ImageButton控制元件顯示的圖片的路徑。AlternateText屬性用於在只顯示文字的瀏覽器中提供圖片的替代文字。
註解：輔助功能標準要求每一幅圖片都包含替代文字。此外，要記住有些使用者會關閉瀏覽器的圖片功能，以獲得更快的網上衝浪體驗。
注意，ImageButton控制元件的Click事件處理程式不同於其他兩個按鈕控制元件。傳遞給事件處理程式的第二個引數是ImageClickEventArgs類的例項。此類有下面兩個屬性：
X——使用者點選圖片時的X座標。
Y——使用者點選圖片時的Y座標。
可以使用ImageButton控制元件建立簡單的影象對映。程式碼清單4中的頁面包含一個顯示一個靶子圖片的ImageButton控制元件。點選靶子的中央，就會顯示一個成功資訊（見圖4）。
程式碼清單4ImageButtonTarget.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head id="Head1" runat="server">
<title>ImageButton Target</title>
</head>
<form id="form1" runat="server">
<div>
<asp:ImageButton id="btnTarget" ImageUrl="Target.gif" Runat="server" OnClick="btnTarget_Click" /><br /><br />
<asp:Label id="lblResult" Runat="server" />
</div>
</form>
註解：ImageButton可以用來建立伺服器端的影象對映。殘障人士不能使用伺服器端的影象對映。建立ImageMap最好的方法是使用用於建立客戶端的影象對映的ImageMap控制元件。本章下一節將討論ImageMap控制元件。
圖4通過ImageButton檢索X座標和Y座標
ImageButton控制元件支援下列屬性（不完全列表）：
·AccessKey——指定一個導向ImageButton控制元件的鍵。
·AlternateText——為圖片提供替代文字（輔助功能要求）。
·DescriptionUrl——用於提供指向包含該圖片詳細描述的頁面的連結（複雜的圖片要求可訪問）。
·CommandArgument——用於指定傳給Command事件的命令引數。
·CommandName——指定傳給Command事件的命令名。
·Enable——用於禁用該ImageButton。
·GenerateEmptyAlternateText——為AlternateText屬性設空字串值。
·ImageAlign——用於將影象和頁面中其他HTML元素對齊。可能的值有AbsBottom、AbsMiddle、Baseline、Bottom、Left、Middle、NotSet、Right、TextTop和Top。
·ImageUrl——用於指定圖片的URL。
·OnClientClick——指定點選ImageButton時執行的客戶端指令碼。
·PostBackUrl——用於設定將表單傳給某個頁面。
·TabIndex——設定ImageButton控制元件的Tab順序。
ImageButton控制元件支援下面的方法：
·Focus()——用於把初始表單焦點設為該ImageButton控制元件。
ImageButton控制元件還支援下面兩個事件：
·Click——點選ImageButton控制元件時引發。
·Command——點選ImageButton控制元件時引發。CommandName和CommandArgument被傳給這個事件。
四、Button控制元件使用客戶端指令碼
三種Button控制元件都支援OnClientClick屬性。可以使用此屬性來執行點選按鈕時所需的任何客戶端程式碼。程式碼清單5的頁面展示瞭如何使用OnClientClick屬性來顯示一個確認對話方塊（見圖5）。
程式碼清單5ButtonOnClientClick.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head id="Head1" runat="server">
<title>Button OnClientClick</title>
</head>
<form id="form1" runat="server">
<div>
<asp:Button id="btnDelete" Text="Delete Website" OnClick="btnDelete_Click" OnClientClick="return confirm('Are you sure?');" Runat="server" /><br /><br />
<asp:Label id="lblResult" Runat="server" />
</div>
</form>
圖5顯示客戶端確認對話方塊
程式碼清單5中的Button控制元件包含一個OnClientClick屬性，在客戶端點選該按鈕時，執行JavaScript指令碼。該指令碼顯示一個確認對話方塊。如果確認對話方塊返回False，那麼取消按鈕點選事件，包含該按鈕的表單也不會傳回伺服器端。
像大多數ASP.NET控制元件一樣，Button控制元件支援擴充套件屬性，只需簡單地為控制元件新增任意的屬性，就可以處理其他的客戶端事件。如果ASP.NET Framework不能識別控制元件上宣告的屬性，框架只會簡單地把這個屬性傳給瀏覽器。
例如，程式碼清單6中的頁面包含一個擁有onmouseover和onmouseout屬性的控鈕控制元件。把滑鼠懸停在按鈕上，按鈕上的文字就會改變。
程式碼清單6ButtonExpando.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head id="Head1" runat="server">
<title>Button Expando</title>
</head>
<form id="form1" runat="server">