谁有鼠标点击超链接导航时，样式仍然保持的一段js代码

Question

谁有鼠标点击超链接导航时，样式仍然保持的一段js代码
如果回答如下就不必了
  <script type="text/javascript">
  $(function(){
$(".nav > ul > li").click(function(){
  $(this).siblings().removeClass("visit");
  $(this).addClass("visit");
});
$(".nav > ul > li").mouseover(function(){
  $(this).siblings().removeClass("hover");
  $(this).addClass("hover");});  });});
</script>
因为它只适用于本页面，如果跳转其他页面（一样的导航条）就不行了，

Answer 1

你要么就新打开页面，这样以前的页面就能保存了。
要不就把下面的内容做成iframe来进行切换内容，这样也能保存点击按钮的样式。

Answer 2

内容做成iframe我也想到过，但是因为网站的已经建起来了（asp.net），再修改很麻烦的，您说的第一种方法 “新打开页面是什么意思，”？？

Answer 3

<a href="aa.htm" target="_blank">aa</a>就是给a标签加上target这个属性，就是新窗口打开，这样也不会影响到页面里的a标签点击后的样式

Answer 4

这样一点意义都没有啊，我要的就是点击菜单"about us”从 a.html跳转到aa.html页面时，
在a.html页面上经过这个菜单项时，有个css样式背景色为#f00
点击后跳到aa.html页面时，这个菜单项的css样式仍保留---背景色为#f00

Answer 5

通过 URL 后缀来判断 例如 产品页面 products.html 就知道是那个导航的了要不是就通过 cookie  来搞

Answer 6

要不还可以在 每个页面 加个标识 例如 1.html 里，放个 1 出来，就知道是当行的第一个了，可以用一个DIV或者INPUT存，但是比较麻烦，每个页面都要有，或者每个页面传个ID或其他的，根据这个来判断也行一般简单的企业站 用判断 页面URL后缀都可以了cookie 主要怕不支持，但是一般其实都比较少不支持cookie的了加标识的比较麻烦

Answer 7

那如何用判断 页面URL后缀的方法实现呢？
还有我每个页面跳转是都会有个传值ID，改什么实现呢？

Answer 8

http://topic.csdn.net/u/20110809/15/35057faa-e1fb-4677-8387-7bf263a1246c.html楼主看看这个~·昨天正好遇到一个类似的~·

Answer 9

我是用asp.net建站的，那个传值的方法我会的，
<div  id="nav">
  <ul>
    <li><a href="/">网站首页</a></li>
    <li><a href="Basics.aspx?ChannelID=1">关于我们</a></li>
    <li><a href="Products.aspx?ChannelID=4">新品推荐</a></li>
    <li><a href="Products.aspx?ChannelID=3">产品中心</a></li>
    <li><a href="Articles.aspx?ChannelID=5">新闻中心</a> </li>
    <li><a href="Jobs.aspx?ChannelID=6">人才招聘</a> </li>
  </ul>
 </div>
</div>
每个都有传值ChannelID
 在后台都有接收这个值Request.QueryString["ChannelID"]
现在的问题是：如何用这个值来实现我提出的问题，
实现导航点击保留的样式

Answer 10

到了相应的页面，，获取ChannelID啊可以用JS来直接获取，split或正则或parseInt什么的，找到数字就可以了

Answer 11

页面加载根据url 设置样式！<div id="nav">
  <ul>
  <li><a href="/">网站首页</a></li>
  <li><a href="Basics.aspx?ChannelID=1">关于我们</a></li>
  <li><a href="Products.aspx?ChannelID=4">新品推荐</a></li>
  <li><a href="Products.aspx?ChannelID=3">产品中心</a></li>
  <li><a href="Articles.aspx?ChannelID=5">新闻中心</a> </li>
  <li><a href="Jobs.aspx?ChannelID=6">人才招聘</a> </li>
  </ul>
 </div>
</div><script type='text/javascript'>
    
       (function(){
          
            var nav= $('nav');
              var menuList = nav.getElementsByTagName('a');
        var url = document.location.href;
        var hrefUrl = '';
        if(menuList==null || typeof(menuList)=='undefined')
        { return;}
        var index=0;
        for(;index < menuList.length;index++)
        {
            hrefUrl = menuList[index].href;
            hrefUrl = hrefUrl.substr(hrefUrl.lastIndexOf('/')+1);
            if(hrefUrl!='' && hrefUrl != '/')
            {
                if(url.indexOf(hrefUrl) > 0 )
                {
                    break;
                }
            }
        }
        if(index <  menuList.length)
        {
            menuList[index].id = 'a_Checked'; // 用ID控制当前菜单样式，当然也可以用 class 和style        }      
 
        })();
        
    </script>

Answer 12

十分感谢老胡！谢谢，问题解决了
不过有些细节好像出错了，我改了一下
$(function(){
var menuList=document.getElementById('nav').getElementsByTagName('a');
...
改了下取值变量
嘿嘿
也感谢各位的解答！我是一个js菜鸟，谁有一个很好的js交流平台或者教程等等，不胜感激！

Answer 13

请问这句话的意思是什么
hrefUrl = hrefUrl.substr(hrefUrl.lastIndexOf('/')+1);