Question

我想通过当前网址突出显示相关的菜单项。

这是html

       <ul class="nav">
          <li>
            <a href="/ratings">Rate</a>
          </li>
          <li class="">
            <a href="/ratings/list">All Pics</a>
          </li>
          <li>
            <a href="/ratings/new">Upload Your Own</a>
          </li>
        </ul>

和简单的jquery：

$(function () {
    var active = 'active',
        $lastMatch,
        s = window.location.pathname;

    $('.nav a').each(function (index, item) {
        if (s.indexOf($(this).attr("href")) !== -1) {
            $lastMatch = $(this).closest('li');
        }
    });

    if ($lastMatch.length){
        $lastMatch.addClass(active);
    }
});

的工作原理。但是如果我导航到与0.0.0.0:3000/ratings/list/1不同的网址`0.0.0.0:3000/ratings/list，则会发生一个奇怪的错误并且它确实保持“活跃”。

我尝试使用fire bug进行调试，我发现li获得了active类，但它被其他东西取消了，我不知道它是什么。

Answer 1

尝试更改以下行：

if (s.indexOf($(this).attr("href")) !== -1) {

这个：

if (s.indexOf($(this).attr("href"), s.length - $(this).attr("href").length) !== -1) {

所以要比较两个字符串是否与字符串的结尾匹配，而不是像你正在做的那样。通过这种方式，您可以避免遇到角落情况。

rails通过url选择当前菜单标题

1 个答案: