Reputation: 5757
I have menu in my website and I want to Remove and Add Attribute id using jQuery based on Different Pages.
My Code :
<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>
Here, on Home Page, id 'current' is set to first li. Now, when user visits Category, I want to remove id current from Users and set id to Category.
How to do this ?
Upvotes: 1
Views: 1705
Reputation: 57105
Try
$(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
});
Upvotes: 2
Reputation: 14649
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;
}
Upvotes: 0
Reputation: 2852
Use this,
$('#nav li').click(function(){
$('#current').removeAttr('id');
$(this).attr('id','current');
}
Upvotes: 0
Reputation: 15393
$('#nav li').click(function() {
$('li#current').removeAttr("id");
$(this).attr('id' , 'current');
});
Upvotes: 0
Reputation: 85545
Try this:
//$('#nav li').each(function(){
$('#current').removeAttr('id');
$('li:active').attr('id','current');
//}
Upvotes: 0
Reputation: 21666
$('li').click(function(e) {
e.preventDefault();
$('li').removeAttr('id');
$(this).attr('id','current');
});
Upvotes: 0