共用方式為


HtmlButton 伺服器控制項宣告式語法

更新:2007 年 11 月

建立伺服器端控制項,其對應至 <button> HTML 項目,並且允許您建立按鈕。

 <button     CausesValidation="False|True"     Disabled="Disabled"     EnableViewState="False|True"     Id="string"     ValidationGroup="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"     >         <!--buttonText, image, or control-->  </button>

備註

使用 HtmlButton 控制項,對 HTML <button> 項目進行設計程式。您可以為 HtmlButton 控制項的 ServerClick 事件提供自訂程式碼,指定按下控制項時所執行的動作。

注意事項:

HtmlButton 控制項會將 JavaScript 呈現至用戶端瀏覽器。用戶端瀏覽器必須啟用 JavaScript,這個控制項才能正確運作。如需用戶端指令碼的詳細資訊,請參閱 ASP.NET Web 網頁中的用戶端指令碼

您也可以自訂放置在 ASP.NET (.aspx) 網頁中的按鈕外觀。HTML 4.0 <button> 項目可以讓您建立由內嵌 HTML 項目 (甚至其他 Web Form 控制項) 所組成的按鈕。

注意事項:

<button> 項目在 HTML 4.0 規格中定義。

修改 HtmlButton 控制項的外觀有多種方式。您可以在控制項項目的開頭標記中指派樣式屬性給按鈕、在控制項的開頭和結尾標記之間所插入的文字周圍包含格式項目,或為用戶端 onmouseover 和 onmouseout 事件指派屬性值變更來指定變更。您也可以在按鈕項目本身之內包含影像,或甚至包含其他 Web Form 控制項。

範例

下列程式碼範例將示範如何將樣式、DHTML 事件、文字和影像加入 HtmlButton 控制項。它還包括兩個簡單的事件處理常式程式碼,其透過 <span> 項目所建立的 HtmlGenericControl 之執行個體顯示訊息。

<%@ 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>HtmlButton Control</title>

   <script runat="server">
      Sub Button1_OnClick(Source As Object, e As EventArgs)
         Span1.InnerHtml = "You clicked Button1"
      End Sub

      Sub Button2_OnClick(Source As Object, e As EventArgs)
         Span1.InnerHtml = "You clicked Button2"
      End Sub
   </script>

</head>

<body>
   <h3>HtmlButton Sample</h3>

   <form id="Form1" runat="server">
      <p />
      <button id="Button1" 
              onserverclick="Button1_OnClick" 
              style="font: 8pt verdana;
                    background-color:Lime;
                    border-color:black;
                    height:30;
                    width:100" 
              runat="server">
          <img src="/quickstart/aspplus/images/right4.gif" alt="Embedded image" /> Click me!
       </button>
       &nbsp;With embedded &lt;img&gt; tag
       <p />
       <p />
       <button id="Button2" 
               onserverclick="Button2_OnClick" 
               style="font: 8pt verdana;
                      background-color:Lime;
                      border-color:black;
                      height:30;
                      width:100"
               onmouseover="this.style.backgroundColor='yellow'"
               onmouseout="this.style.backgroundColor='lightgreen'"
               runat="server">
          Click me too!
       </button>
       &nbsp;With rollover effect
       <p />        
       <p />
       <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>HtmlButton Control</title>

   <script runat="server">
      void Button1_OnClick(object Source, EventArgs e) 
      {
         Span1.InnerHtml="You clicked Button1";
      }
      void Button2_OnClick(object Source, EventArgs e) 
      {
         Span1.InnerHtml="You clicked Button2";
      }
   </script>

</head>
<body>
   <h3>HtmlButton Sample</h3>

   <form id="Form1" runat="server">
      <p />
      <button id="Button1" 
              onserverclick="Button1_OnClick" 
              style="font: 8pt verdana;
                    background-color:Lime;
                    border-color:black;
                    height:30;
                    width:100" 
              runat="server">
          <img src="/quickstart/aspplus/images/right4.gif" alt="Embedded image" /> Click me!
       </button>
       &nbsp;With embedded &lt;img&gt; tag
       <p />
       <p />
       <button id="Button2" 
               onserverclick="Button2_OnClick" 
               style="font: 8pt verdana;
                      background-color:Lime;
                      border-color:black;
                      height:30;
                      width:100"
               onmouseover="this.style.backgroundColor='yellow'"
               onmouseout="this.style.backgroundColor='Lime'"
               runat="server">
          Click me too!
       </button>
       &nbsp;With rollover effect
       <p />        
       <p />
       <span id="Span1" runat="server" />
   </form>
</body>
</html>

請參閱

參考

HtmlButton

其他資源

HTML 伺服器控制項