0

当页面根据 URL 中的目录加载时,我试图将一个类换成另一个类。我的代码适用div于我菜单中的第一个,但不适用于其他任何人。这是代码:

$('document').ready(function() {
    var pathname = window.location.pathname;
    pathname = pathname.replace('/MVC/', '');

    if (pathname == $('.navitem').attr('rel')) {
        $('.navitem[rel='+pathname+']').toggleClass('navitem selected_menu')
    }
});

HTML如下:

<div class="navitem" rel="dashboard"><a href="http://localhost/MVC/dashboard">Dashboard</a></div>
<div class="navitem" rel="chat"><a href="http://localhost/MVC/chat">Chat</a></div>
<div class="navitem" rel="users"><a href="http://localhost/MVC/user">Users</a</div>

当 I 时alert($('.navitem').attr('rel')),它总是返回第一个的reldiv。我如何让它查看所有这些而不是只查看第一个?

4

5 回答 5

2

您不能只使用一个比较操作,因为您必须检查所有divs。

$(".navitem").filter(function() {
  return $(this).attr("rel") === pathname;  // filter out the correct one(s)
}).toggleClass("navitem selected_menu");

顺便说一句,通常是$(document).ready. $尽管在 的情况下传递给什么并不重要.ready,但这是事实上的标准。

于 2012-05-29T19:29:19.570 回答
1

您需要使用每个循环遍历它们:

$('.navitem').each(function(){
    if (pathname == $(this).attr('rel')) {
        $(this).toggleClass('navitem selected_menu')
    }
});
于 2012-05-29T19:28:41.583 回答
1

您需要使用循环。尝试这个:

$(".navItem").each(function () {
    if (pathname == $(this).attr('rel')) {
        $(this).toggleClass('navitem selected_menu')
    }
});
于 2012-05-29T19:28:50.963 回答
1

无需检查任何东西,让选择器完成所有工作。

$('navitem[rel=' + pathname + ']').toggleClass('navitem selected_menu');

甚至不包括 if 语句。

于 2012-05-29T19:29:03.477 回答
0

尝试使用 JQuery 的 .each 方法来测试所有匹配的元素。像这样:

$('document').ready(function() {
    var pathname = window.location.pathname;
    pathname = pathname.replace('/MVC/', '');

    $('.navitem').each(function() {
        if ($(this).attr('rel') == pathname) {
            $(this).toggleClass('selected_menu');
        }
    });

});
于 2012-05-29T19:50:35.820 回答