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

Question

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

这是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);
    }
});

作品。 但是，如果我导航到不同的 url 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) {

因此，要比较两个字符串是否在字符串末尾匹配，而不是像您所做的那样在任何部分匹配。这样你就可以避免你遇到的角落案例。