Reputation: 901
I have this code:
jquery:
$(".clr").click(function () {
$(".clr").each(function () {
$(this).parents("li").css("background", "#000")
})
var color1 = "#f8ac00";
$(this).parents("li").css("background", color1);
});
ASP.NET:
<ul id="css3menu1" class="topmenu">
<li class="topfirst">
<asp:LinkButton ID="lnkbtn_dashbd" CssClass="clr" Height="18" Width="100" runat="server">Dashboard</asp:LinkButton>
</li>
<li class="topmenu">
<asp:LinkButton ID="lnkbtn_events" CssClass="clr" Height="18" Width="100" runat="server">Events</asp:LinkButton>
</li>
<li class="topmenu">
<asp:LinkButton ID="lnkbtn_myaccount" CssClass="clr" Height="18" Width="100" runat="server">My Account</asp:LinkButton>
</li>
<li class="toplast">
<asp:LinkButton ID="lnkbtn_abtus" CssClass="clr" Height="18" Width="100" runat="server">About Us</asp:LinkButton>
</li>
</ul>
Image reference:
I have defined CssClass property of LinkButton, mapping it to Jquery class. But on click, this code is not working. I don't know why? Please help me.
Upvotes: 0
Views: 145
Reputation: 93601
Aside from not knowing what behavior you are getting from the button clicks (page postback?), these are just my suggestions put together for you to try.
Please try the following as a test:
$(".clr").click(function (e) {
// Stop the click behavior for now (postback?)
e.preventDefault();
// Turn off all the LIs
$("li:has(.clr)").css("background", "#000");
// Turn on the closest LI to the clicked linkButton
var color1 = "#f8ac00";
$(this).closest("li").css("background", color1);
})
Upvotes: 1