Exportieren (0) Drucken
Alle erweitern

Gewusst wie: Reagieren auf Mausklicks in ImageMap-Webserversteuerelementen

Sie können ein ImageMap-Steuerelement oder einen abgegrenzten Bereich (Hotspot) innerhalb eines Steuerelements so konfigurieren, dass beim Klicken darauf eine andere Seite aufgerufen oder ein Postback ausgeführt wird. Sie können die Einstellungen des Steuerelements für jeden Hotspot überschreiben.

Wenn das ImageMap-Steuerelement oder ein einzelner Hotspot für den Zugriff auf einen bestimmten URL konfiguriert wurde, können Sie nicht direkt auf das Klicken reagieren. Wenn das Steuerelement bzw. der Hotspot für das Ausführen eines Postbacks konfiguriert ist, können Sie einen Handler für das Ereignis schreiben und ermitteln, auf welchen Hotspot geklickt wurde.

So reagieren Sie auf einen Mausklick in einem ImageMap-Steuerelement

  1. Fügen Sie einen Click-Ereignishandler für das ImageMap-Steuerelement hinzu. Das zweite Argument des Handlers muss vom Typ ImageMapEventArgs sein.

  2. Lesen Sie im Ereignishandler die PostBackValue-Eigenschaft des ImageMapEventArgs-Objekts aus, um zu bestimmen, auf welchen Hotspot geklickt wurde.

Beispiel

Das folgende Codebeispiel zeigt, wie Sie auf einen Mausklick in einem ImageMap-Steuerelement reagieren können. Die Seite enthält ein ImageMap-Steuerelement mit vier rechteckigen Hotspots. Die PostBackValue-Eigenschaft der einzelnen Hotspots wird auf einen eindeutigen Wert festgelegt. Der Code im Handler prüft, ob es sich um einen der Werte handelt, und zeigt eine entsprechende Antwort an.

<% @ Page Language="C#" %>
<script runat="server">
protected void ImageMap1_Click(object sender, ImageMapEventArgs e)
{
    String region = "";
    switch(e.PostBackValue)
    {
        case "NW":
            region = "Northwest";
            break;
        case "NE":
            region = "Northeast";
            break;
        case "SE":
            region = "Southeast";
            break;
        case "SW":
            region = "Southwest";
            break;
    }
    Label1.Text = "You clicked the " + region + " region.";
}
</script>

<html>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:Label runat="server" ID="Label1" />
    <br />
    <br />
        <asp:ImageMap ID="ImageMap1" ImageUrl="~/Images/MapTest.PNG" 
            runat="server" 
            HotSpotMode="PostBack" 
            OnClick="ImageMap1_Click">
         <asp:RectangleHotSpot Bottom="100" Right="100" 
             HotSpotMode="PostBack" PostBackValue="NW" />
         <asp:RectangleHotSpot Bottom="100" Left="100" Right="200" 
             HotSpotMode="PostBack" PostBackValue="NE" />
         <asp:RectangleHotSpot Bottom="200" Right="100" Top="100" 
             PostBackValue="SW" />
         <asp:RectangleHotSpot Bottom="200" Left="100" Right="200" 
             Top="100" PostBackValue="SE" />
        </asp:ImageMap>
    </div>
    </form>
</body>
</html>

Siehe auch

Anzeigen:
© 2015 Microsoft