0

我有 2 个菜单。一个在标题中；另一个显示在页面的左侧边栏上。

标题

<div id="topmenu">
    <ul>
        <li><a href="/">Home</a></li>
        <li><a href="/baseball">Baseball</a></li>
        <li><a href="/football">Football</a></li>
    </ul>
</div>

在棒球页面上

<div id="leftmenu">
    <ul id="teams">
        <li><a href="/yankees">Yankees</a></li><br />
        <li><a href="/redsox">Red Sox</a></li><br />
        <li><a href="/cubs">Cubs</a></li><br />
    </ul>
</div>

以下是我突出显示#topmenu 的方法（说来话长，但它有效）：

  $(function(){

    var url = window.location.pathname, 
        urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); 
        $('#topmenu li a').each(function(){

            if(urlRegExp.test(this.href.replace(/\/$/,''))){
                $(this).addClass('blue');
            }
        });
   });

挑战在于#leftmenu：

1 - 我正在使用 jQuery 显示/隐藏每个 -li- 的内容

2 - 当页面最初加载时，#topmenu 项目被突出显示，但我也希望 #leftmenu 中的第一个项目也被突出显示。换句话说，我希望在选择#topmenu 项和选择第一个#leftmenu 项时显示相同的页面。我怎样才能做到这一点？

如果有帮助，棒球页面的设置如下：

棒球.php

<div id="header">
</div>

<div id="main">
<?php include('baseball_stuff.php'); ?>
</div>

<div id="footer">
</div>

然后我在#topmenu 中链接到ballball.php 并在#leftmenu 中链接到ballball_stuff.php，因此我不必复制内容。

jsfiddle：http: //jsfiddle.net/Ft8FR/

4

1 回答 1

1

你的这部分问题对我来说没有任何意义

我希望在选择#topmenu 项目和选择第一个#leftmenu 项目时出现相同的页面。我怎样才能做到这一点？

不过你之前说的还是有道理的。所以我会回答这个问题，希望它是你想要的。

我还希望突出显示#leftmenu 中的第一项

$('#leftmenu li:first').addClass('blue');
于 2012-04-17T03:53:27.087 回答