jquery实现导航栏鼠标点击后实行背景高亮，点击离开恢复（超级简单！！！！），jquery导航栏

1、header部分要引入Jquery

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
     <script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
     <style type="text/css">
         li:hover, .red{
             background: red;
         }
         ul li{ 200px; height:30px; display:block; border:1px solid #ccc;}
    </style>
</asp:Content>

2、body部分

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
 

　　<div class="dianji">
    　　<ul>
        　　<li>div1</li>
        　　<li class="red">div2</li>
        　　<li>div3</li>
        　　<li>div4</li>
        　　<li>div5</li>
    　　</ul>
　　</div>

　　//必须要添加的JS   方法一
　　<script type="text/javascript">
    　　$(document).ready(function () {
        　　$(".dianji li").click(function () {
         　　   $(this).addClass("red").siblings().removeClass("red");
       　　 })
    　　});
　　</script>

　　//方法二

　　　<script type="text/javascript">
　　 　　 $(function () {
　　　　　　　　$(".dianji a").click(function () {
　　　　　　　　　　$(this).parent("li").addClass('red').siblings().removeClass("red");
　　　　　　　　});
　　　　　　});
　　 </script>

</asp:Content>