0

我正在使用 Ruby on Rails 开发应用程序。我为我的页面添加了一组链接(使用部分链接),我想active在有人访问页面时添加一个类。

所以如果我有这样的链接:(这包含在所有页面中,以使页面更干净)

<ul>
<li><a href="profile">Profile</a></li>
<li><a href="profile/users">Users</a></li>
</ul>

我有 jQuery:

var loc = window.location.pathname;
var href = ??
if(loc == href){
 var thisli = $('href').parents('li');
 $(this).addClass('active');
}

我还在想我该怎么做这样的事情?除非有别的办法?我习惯于使用 PHP,因此我不熟悉 rails 是否有其他更简单的方法可以将活动类添加到某人当前正在访问的链接中。

谢谢!

4

2 回答 2

2

你可以试试

$(function(){
    $('a[href="' + window.location.pathname + '"]').closest('li').addClass('active');
})
于 2013-03-11T03:47:33.053 回答
0

使用 javascript/jQuery,您可以检查当前 URL 路径,window.location.pathname并与链接进行比较。使用a元素,您可以比较绝对 URL。

为了比较两个 URL,我们需要做一些额外的工作。基本思想是创建另一个 [hidden]a元素,将该元素的 href 设置为测试 URL,然后查看它们的两个生成的绝对 URL 是否匹配。

所以首先:

function compareURLs(url1, url2) {
    var testElement = $('<a href=""></a>'),
        result1, result2;
    testElement.attr('href', url1);
    result1 = testElement.get(0).href;
    testElement.attr('href', url2);
    result2 = testElement.get(0).href;
    return result1 == result2;
}

然后检查每个a元素:

var path = window.locaion.pathname;
$('ul a').each(function() {
    if (compareURLs(path, $(this).attr('href')) {
        $(this).addClass('active');
    }
}
于 2013-03-11T03:53:33.323 回答