HtmlInputImage 伺服器控制項宣告式語法
建立伺服器端控制項，使其對應至 <input type=image> HTML 項目，並讓您建立顯示影像的按鈕。
<input
Type="Image"
EnableViewState="False|True"
Id="string"
Visible="False|True"
OnDataBinding="OnDataBinding event handler"
OnDisposed="OnDisposed event handler"
OnInit="OnInit event handler"
OnLoad="OnLoad event handler"
OnPreRender="OnPreRender event handler"
OnServerClick="OnServerClick event handler"
OnUnload="OnUnload event handler"
runat="server"
/>
備註
使用 HtmlInputImage 控制項，對 HTML <input type=image> 項目進行設計程式。 您可以搭配 HtmlInputText、HtmlTextArea 和其他控制項使用這個控制項來建構使用者輸入表單。 由於這個控制項是在伺服器上執行的 <input type=image> 項目，因此有提供和 HTML 一樣的按鈕自訂。 這個控制項會為不支援動態超文字標記語言 (DHTML) 和 HtmlButton 控制項的瀏覽器提供替代項目。
.gif "注意事項") 注意事項 |
|---|
這個控制項不需要結尾標記。 |
HTML 控制項其中一個比 Web 控制項還要強的優勢是伺服器端的事件不會和發生在用戶端的事件相衝突，除非伺服器與用戶端程式碼本身彼此取消命令。 在這種情況下，您可以使用 DHTML 事件來修改包含在 Web Form 網頁上任何影像的外觀。
範例
下列範例會比較靜態影像按鈕控制項和影像按鈕控制項，後者使用 DHTML onMouseOver 事件 (顯示香蕉圖片) 和 onMouseOut 事件 (顯示原始的芒果圖片)。 這兩個影像按鈕都包含 OnServerClick 事件處理常式。
<%@ Page Language="VB" AutoEventWireup="True" %>
<!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>
<title>HtmlInputImage Control</title>
<script runat="server">
Sub Button1_Click(Source As Object, e As ImageClickEventArgs)
Span1.InnerHtml = "You clicked button1"
End Sub
Sub Button2_Click(Source As Object, e As ImageClickEventArgs)
Span1.InnerHtml = "You clicked button2"
End Sub
</script>
</head>
<body>
<h3>HtmlInputImage Sample</h3>
<form id="Form1" runat="server">
<input type="image"
id="InputImage1"
src="/images/mango.jpg"
onserverclick="Button1_Click"
runat="server" />
<br />
<input type="image"
id="InputImage2"
src="/images/mango.jpg"
onmouseover="this.src='/images/banana.jpg';"
onmouseout="this.src='/images/mango.jpg';"
onserverclick="Button2_Click"
runat="server" />
With rollover effect (HTML 4.0)
<br />
<span id="Span1" runat="server" />
</form>
</body>
</html>
<%@ Page Language="C#" AutoEventWireup="True" %>
<!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>
<title>HtmlInputImage Control</title>
<script runat="server">
void Button1_Click(object Source, ImageClickEventArgs e)
{
Span1.InnerHtml="You clicked button1";
}
void Button2_Click(object Source, ImageClickEventArgs e)
{
Span1.InnerHtml="You clicked button2";
}
</script>
</head>
<body>
<h3>HtmlInputImage Sample</h3>
<form id="Form1" runat="server">
<input type="image"
id="InputImage1"
src="/images/mango.jpg"
onserverclick="Button1_Click"
runat="server" />
<br />
<input type="image"
id="InputImage2"
src="/images/mango.jpg"
onmouseover="this.src='/images/banana.jpg';"
onmouseout="this.src='/images/mango.jpg';"
onserverclick="Button2_Click"
runat="server" />
With rollover effect (HTML 4.0)
<br />
<span id="Span1" runat="server" />
</form>
</body>
</html>