JQuery click method on asp.net Menu item?

问题

I have asp.net Menu Item <asp:MenuItem NavigateUrl="" Text="Download" Value="Download"/>. When this item gets clicked, I want to execute jQuery click method. How can we do that?

回答1:

Provide a CssClass property with some class to the menu item. On client side find the element using that class and attach click event handler to it.

<asp:MenuItem NavigateUrl="" CssClass="menuItem" Text="Download" Value="Download"/>

Js

$('.menuItem').click(function(){
    //do stuff here
});

Update:

I think you can specify the css class in this way.

<asp:Menu ID="mainMenu" runat="server">
    ..
    <asp:MenuItem NavigateUrl="" CssClass="menuItem" Text="Download" Value="Download"/>
    ..
    <StaticMenuItemStyle CssClass="menuItem" />
</asp:Menu>

回答2:

Sample JQuery

<script language="javascript" type="text/javascript">
   $(function () {
        $(".MyMenu a").each(function (index) {
             $(this).click(function () {
                 alert(index);
                 return false;
             });
        });
   });
</script>

---

Modified HTML

<asp:Menu ID="_mainMenu" RenderingMode="Table" runat="server" CssClass="MyMenu" autopostback="true">
    <Items>
        <asp:MenuItem Text="Home" Value="Home"></asp:MenuItem>
        <asp:MenuItem Text="Index" Value="Home"></asp:MenuItem>
    </Items>
</asp:Menu>

---

Note - RenderingMode="Table"

来源：https://stackoverflow.com/questions/9928488/jquery-click-method-on-asp-net-menu-item