ImageButton Web サーバー コントロール

ユーザーがイメージをクリックした場合に処理できるようにします。これにより、イメージ マップに似た機能を使用できるようになります。

<asp:ImageButtonid="ImageButton1"      ImageUrl="string"     Command="Command"     CommandArgument="CommandArgument"     CausesValidation="true | false"     OnClick="OnClickMethod"     runat="server"/>

解説

ImageButton コントロールを使用して、マウスのクリックに応答するイメージを表示できます。コントロールに表示するイメージを指定するには、ImageUrl プロパティを設定します。

ImageButton コントロールがクリックされると、Click イベントと Command イベントの両方が発生します。

OnClick イベント ハンドラを使用して、イメージがクリックされた場所の座標をプログラムによって判断できます。次に、その座標の値に基づいて、応答のコードを記述できます。原点 (0, 0) は、イメージの左上隅であることに注意してください。

OnCommand イベント ハンドラを使用して、ImageButton コントロールをコマンド ボタンのように機能させることができます。CommandName プロパティを使用して、コマンド名をコントロールに関連付けることができます。これによって、複数の ImageButton コントロールを同じ Web ページに配置できます。OnCommand イベント ハンドラで、CommandName プロパティの値をプログラムによって識別し、各 ImageButton コントロールがクリックされたときに実行する適切なアクションを判断できます。CommandArgument プロパティを使用して、コマンドに関する追加情報 (昇順の指定など) を渡すこともできます。

メモ   <asp:ImageButton> 要素には内容が含まれないため、個別に終了タグを使用する代わりに /> でタグを閉じることができます。

既定では、ImageButton コントロールがクリックされたときに、ページの検証が行われます。ページ検証では、ページ上の検証コントロールに関連付けられている入力コントロールが、その検証コントロールによって指定されている入力規則を満たしているかどうかが確認されます。reset ボタンなど、この動作を無効にする必要がある ImageButton コントロールの場合は、CausesValidation プロパティを false に設定します。

ImageButton Web サーバー コントロールのプロパティとイベントの詳細については、ImageButton クラスのドキュメントを参照してください。

ImageButton コントロールを使用して、イメージ上でマウス ポインタがクリックされたときに、ポインタ位置の座標を表示する方法を次の例に示します。

<%@ Page Language="VB" AutoEventWireup="True" %>
<html>
<head>
   <script runat="server">
      Sub ImageButton_Click(sender As Object, e As ImageClickEventArgs) 
         Label1.Text="You clicked the ImageButton control at the " & _
                     "Coordinates: (" & e.X.ToString() & ", " & _
                     e.Y.ToString() & ")"
      End Sub
   </script>
</head>
<body>
   <form runat="server">
      <h3>ImageButton Sample</h3>
      Click anywhere on the image.<br><br>
      <asp:ImageButton id="imagebutton1" runat="server"
           AlternateText="ImageButton 1"
           ImageAlign="left"
           ImageUrl="images\pict.jpg"
           OnClick="ImageButton_Click"/>
      <br><br>
      <asp:label id="Label1" runat="server"/>
   </form>
</body>
</html>
[C#]
<%@ Page Language="C#" AutoEventWireup="True" %>
<html>
<head>
   <script runat="server">
      void ImageButton_Click(object Source, ImageClickEventArgs e) 
      {
         Label1.Text="You clicked the ImageButton control at the " +
                     "Coordinates: (" + e.X.ToString() + ", " +
                     e.Y.ToString() + ")";
      }
   </script>
</head>
<body>
   <form runat="server">
      <h3>ImageButton Sample</h3>
      Click anywhere on the image.<br><br>
      <asp:ImageButton id="imagebutton1"
           AlternateText="ImageButton 1"
           ImageAlign="left"
           ImageUrl="images\pict.jpg"
           OnClick="ImageButton_Click"
           runat="server"/>
      <br><br>
      <asp:Label id="Label1" 
           runat="server"/>
   </form>
</body>
</html>

参照

Web サーバー コントロール | ImageButton クラス