Question

我的网站上有菜单，我希望使用基于不同页面的jQuery删除和添加属性ID。

我的代码：

<ul id="nav">
    <li id="current"><a href="">Users</a></li>
    <li><a href="Category.aspx">Category</a></li>
    <li><a href="SubCategory.aspx">SubCategory</a></li>
    <li><a href="Area.aspx">Area</a></li>
    <li><a href="Feedbacks.aspx">Feedbacks</a></li>
</ul>

此处，在主页上，id'current'设置为first li。现在，当用户访问Category时，我想从Users中删除id current并将id设置为Category。

怎么做？

Answer 1

尝试

$(document).ready(function () {
    $('li#current').removeAttr("id"); //remove previously added id
    var loc = $(location).attr('href'); //get current location
    $('#nav a').filter(function () { //filter a tag 
        return this.href == loc;//whose link is pointing to current location
    }).parent().attr('id', 'current'); //add id to parent li
});

Answer 2

$('li').click(function(e) {
        e.preventDefault();
        $('li').removeAttr('id');
        $(this).attr('id','current');
    });

Demo

Answer 3

试试这个：

//$('#nav li').each(function(){
    $('#current').removeAttr('id');
    $('li:active').attr('id','current');
//}

Answer 4

$('#nav li').click(function() {
        $('li#current').removeAttr("id");
        $(this).attr('id' , 'current');
});

Answer 5

使用此，

$('#nav li').click(function(){
  $('#current').removeAttr('id');
  $(this).attr('id','current');
}

Answer 6

switch(window.location.pathname) {
    case 'Category.aspx':
        $("#nav").find('#current').attr('id','');
        $('#nav').find('a[href="Category.aspx"]').attr('id', 'current');
    break;
    case 'SubCategory.aspx':
        $("#nav").find('#current').attr('id','');
        $('#nav').find('a[href="SubCategory.aspx"]').attr('id', 'current');
    break;
    case 'Area.aspx':
        $("#nav").find('#current').attr('id','');
        $('#nav').find('a[href="Area.aspx"]').attr('id', 'current');
    break;
    case 'Feedbacks.aspx':
        $("#nav").find('#current').attr('id','');
        $('#nav').find('a[href="Feedbacks.aspx"]').attr('id', 'current');
    break;

}

使用jQuery删除并添加属性id

6 个答案: