[jQuery] Re: Deactivating parent link with JQuery
You're a dude, thank you. I agree that it would be better server-side, but it would involve hacking the core and I'm against that kind of thing, particularly for something that is purely to satisfy a designer's poncy preference. Thanks for your help. osu On Sep 29, 11:54 am, Liam Potter wrote: > oh I see, this would be better done with some server side code but this > is how you could do that. > > Similar code, just checking for a class. > > $("li a.nav-selected").each(function(){ > > $(this).parents("ul").parents("li").children("a").addClass("nav-selected"); > > }); > osu wrote: > > Hi Liam, > > > Thanks, I think I didn't make myself clear enough - rather than > > occurring when you click the link, I need the class to stay in place > > whenever a child link (i.e. Link 3a, 3b or 3c) is active. I can see > > the class is being applied on click, but how would I make the class > > stay in place? Like this didn't work: > > > $("li a").ready(function(){ > > $(this).parents("ul").parents("li").addClass("nav-selected"); > > }); > > > Thanks, > > > osu > > > On Sep 29, 11:35 am, Liam Potter wrote: > > >> It all works fine, except for this bit > >> $("li ul").siblings("a").click(function(){ > >> return false; > >> }); > >> there are no a tag siblings of the UL, so that will not work. > > >> I've just tested it, and when I click on a subnav link, the class is > >> added to the LI containing Link 3, if you need it to be added to the a > >> tag use this > > >> $("li a").click(function(){ > >> > >> $(this).parents("ul").parents("li").children("a").addClass("nav-selected"); > > >> }); > >> osu wrote: > > >>> Hi Liam, > > >>> This is the list I'm working with: > > >>> > >>> Link 1 > >>> Link 2 > >>> Link 3 > >>> > >>> Link 3a > >>> Link 3b > >>> Link 3c > >>> > >>> > >>> Link 4 > >>> > > >>> I need to add the class 'nav-selected' to Link 3 so I can highlight it > >>> using the same CSS as used to style Link 3a (the active link in the > >>> example above). As you can see, Link 1 has a class of 'nav-path- > >>> selected', so I need to differentiate between that and Link 3 (hence > >>> why I want to add a 'nav-selected' class to Link 3) > > >>> The JQuery I've added to the footer of my page is: > > >>> > >>> // > >>> $(document).ready(function() { > >>> // Disabledparentlink > >>> $("li ul").siblings("a").click(function(){ > >>> return false; > >>> }); > >>> $("li a").click(function(){ > >>> > >>> $(this).parents("ul").parents("li").addClass("nav-selected"); > >>> }); > >>> }); > > >>> //]]> > >>> > > >>> But nothing is happening...no JS errors in Firebug either - any ideas? > > >>> Thanks for your patience, > > >>> osu > > >>> On Sep 29, 11:07 am, Liam Potter wrote: > > I'm assuming you posted an example list and the real list does contain a > tags? I'm also assuming you are running that script with a document > ready handler? > > osu wrote: > > > Thanks Liam, but that's not working... > > > Not sure why .click is in your example? Am I right in thinking by > > adding .parents to the end of each tag in your example that you're > > 'going down' different levels in the unordered list? > > > This is what I have: > > > $("li a").click(function(){ > > $(this).parents("ul").parents("li").addClass("nav-selected"); > > }); > > > Any ideas what's going wrong? > > > On Sep 29, 10:29 am, Liam Potter wrote: > > >> $("li a").click(function(){ > >> $(this).parents("ul").parents("li").addClass("className"); > > >> }); > >> osu wrote: > > >>> Hi Ryan, > > >>> That only affects the child of theparent. > > >>> What I want to do is this: > > >>> > >>> Link 1 > >>> Link 2 *This is the link I want to add a class to* > >>> > >>> Link 2a > >>> Link 2b *This is the active link* > >>> Link 2c > >>> > >>> > >>> Link 3 > >>> > > >>> Rather than affecting a descendent/child of theparentlink, I need to > >>> work on the *parentlink* under which the active link is found. > > >>> Any ideas? > > >>> Thanks, > > >>> osu > > >>> On Sep 26, 7:48 pm, "ryan.j" wrote: > > $('.nav-selected:first') > > On Sep 26, 5:36 pm, osu wrote: > > > Can anyone help with this one please? > > > Thanks, > > > osu > > > On Sep 25, 2:03 pm, osu wrote: > > >> Thanks Ryan for the alternative, > > >> However, I need to do the following now (see message above your > >> last > >> post): > > >> I need to highlight *only* the top-parentitem (the same one I just > >> ran 'return false;' on) with the
[jQuery] Re: Deactivating parent link with JQuery
oh I see, this would be better done with some server side code but this is how you could do that. Similar code, just checking for a class. $("li a.nav-selected").each(function(){ $(this).parents("ul").parents("li").children("a").addClass("nav-selected"); }); osu wrote: Hi Liam, Thanks, I think I didn't make myself clear enough - rather than occurring when you click the link, I need the class to stay in place whenever a child link (i.e. Link 3a, 3b or 3c) is active. I can see the class is being applied on click, but how would I make the class stay in place? Like this didn't work: $("li a").ready(function(){ $(this).parents("ul").parents("li").addClass("nav-selected"); }); Thanks, osu On Sep 29, 11:35 am, Liam Potter wrote: It all works fine, except for this bit $("li ul").siblings("a").click(function(){ return false; }); there are no a tag siblings of the UL, so that will not work. I've just tested it, and when I click on a subnav link, the class is added to the LI containing Link 3, if you need it to be added to the a tag use this $("li a").click(function(){ $(this).parents("ul").parents("li").children("a").addClass("nav-selected"); }); osu wrote: Hi Liam, This is the list I'm working with: Link 1 Link 2 Link 3 Link 3a Link 3b Link 3c Link 4 I need to add the class 'nav-selected' to Link 3 so I can highlight it using the same CSS as used to style Link 3a (the active link in the example above). As you can see, Link 1 has a class of 'nav-path- selected', so I need to differentiate between that and Link 3 (hence why I want to add a 'nav-selected' class to Link 3) The JQuery I've added to the footer of my page is:// $(document).ready(function() {// Disabledparentlink $("li ul").siblings("a").click(function(){ return false; }); $("li a").click(function(){ $(this).parents("ul").parents("li").addClass("nav-selected"); }); });//]]>But nothing is happening...no JS errors in Firebug either - any ideas? Thanks for your patience, osu On Sep 29, 11:07 am, Liam Potter wrote: I'm assuming you posted an example list and the real list does contain a tags? I'm also assuming you are running that script with a document ready handler? osu wrote: Thanks Liam, but that's not working... Not sure why .click is in your example? Am I right in thinking by adding .parents to the end of each tag in your example that you're 'going down' different levels in the unordered list? This is what I have: $("li a").click(function(){ $(this).parents("ul").parents("li").addClass("nav-selected"); }); Any ideas what's going wrong? On Sep 29, 10:29 am, Liam Potter wrote: $("li a").click(function(){ $(this).parents("ul").parents("li").addClass("className"); }); osu wrote: Hi Ryan, That only affects the child of theparent. What I want to do is this: Link 1 Link 2 *This is the link I want to add a class to* Link 2a Link 2b *This is the active link* Link 2c Link 3 Rather than affecting a descendent/child of theparentlink, I need to work on the *parentlink* under which the active link is found. Any ideas? Thanks, osu On Sep 26, 7:48 pm, "ryan.j" wrote: $('.nav-selected:first') On Sep 26, 5:36 pm, osu wrote: Can anyone help with this one please? Thanks, osu On Sep 25, 2:03 pm, osu wrote: Thanks Ryan for the alternative, However, I need to do the following now (see message above your last post): I need to highlight *only* the top-parentitem (the same one I just ran 'return false;' on) with the class 'nav-selected'. Any idea how I could do that? Thanks, osu On Sep 25, 11:13 am, "ryan.j" wrote: rather than removing the href you could use the preventDefault function, which will leave the href intact should you want to unbind it at a later date. usage is something like.. $('a.submit-button').click(function(e){ e.preventDefault(); doSubmit( $(this).html() ); }) On Sep
[jQuery] Re: Deactivating parent link with JQuery
Hi Liam, Thanks, I think I didn't make myself clear enough - rather than occurring when you click the link, I need the class to stay in place whenever a child link (i.e. Link 3a, 3b or 3c) is active. I can see the class is being applied on click, but how would I make the class stay in place? Like this didn't work: $("li a").ready(function(){ $(this).parents("ul").parents("li").addClass("nav-selected"); }); Thanks, osu On Sep 29, 11:35 am, Liam Potter wrote: > It all works fine, except for this bit > $("li ul").siblings("a").click(function(){ > return false; > }); > there are no a tag siblings of the UL, so that will not work. > > I've just tested it, and when I click on a subnav link, the class is > added to the LI containing Link 3, if you need it to be added to the a > tag use this > > $("li a").click(function(){ > > $(this).parents("ul").parents("li").children("a").addClass("nav-selected"); > > }); > osu wrote: > > Hi Liam, > > > This is the list I'm working with: > > > > > Link 1 > > Link 2 > > Link 3 > > > > Link 3a > > Link 3b > > Link 3c > > > > > > Link 4 > > > > > I need to add the class 'nav-selected' to Link 3 so I can highlight it > > using the same CSS as used to style Link 3a (the active link in the > > example above). As you can see, Link 1 has a class of 'nav-path- > > selected', so I need to differentiate between that and Link 3 (hence > > why I want to add a 'nav-selected' class to Link 3) > > > The JQuery I've added to the footer of my page is: > > > > > // > > $(document).ready(function() { > > // Disabledparentlink > > $("li ul").siblings("a").click(function(){ > > return false; > > }); > > $("li a").click(function(){ > > > > $(this).parents("ul").parents("li").addClass("nav-selected"); > > }); > > }); > > > //]]> > > > > > But nothing is happening...no JS errors in Firebug either - any ideas? > > > Thanks for your patience, > > > osu > > > On Sep 29, 11:07 am, Liam Potter wrote: > > >> I'm assuming you posted an example list and the real list does contain a > >> tags? I'm also assuming you are running that script with a document > >> ready handler? > > >> osu wrote: > > >>> Thanks Liam, but that's not working... > > >>> Not sure why .click is in your example? Am I right in thinking by > >>> adding .parents to the end of each tag in your example that you're > >>> 'going down' different levels in the unordered list? > > >>> This is what I have: > > >>> $("li a").click(function(){ > >>> $(this).parents("ul").parents("li").addClass("nav-selected"); > >>> }); > > >>> Any ideas what's going wrong? > > >>> On Sep 29, 10:29 am, Liam Potter wrote: > > $("li a").click(function(){ > $(this).parents("ul").parents("li").addClass("className"); > > }); > osu wrote: > > > Hi Ryan, > > > That only affects the child of theparent. > > > What I want to do is this: > > > > > Link 1 > > Link 2 *This is the link I want to add a class to* > > > > Link 2a > > Link 2b *This is the active link* > > Link 2c > > > > > > Link 3 > > > > > Rather than affecting a descendent/child of theparentlink, I need to > > work on the *parentlink* under which the active link is found. > > > Any ideas? > > > Thanks, > > > osu > > > On Sep 26, 7:48 pm, "ryan.j" wrote: > > >> $('.nav-selected:first') > > >> On Sep 26, 5:36 pm, osu wrote: > > >>> Can anyone help with this one please? > > >>> Thanks, > > >>> osu > > >>> On Sep 25, 2:03 pm, osu wrote: > > Thanks Ryan for the alternative, > > However, I need to do the following now (see message above your last > post): > > I need to highlight *only* the top-parentitem (the same one I just > ran 'return false;' on) with the class 'nav-selected'. > > Any idea how I could do that? > > Thanks, > > osu > > On Sep 25, 11:13 am, "ryan.j" wrote: > > > rather than removing the href you could use the preventDefault > > function, which will leave the href intact should you want to unbind > > it at a later date. > > > usage is something like.. > > > $('a.submit-button').click(function(e){ > > e.preventDefault(); > > doSubmit( $(this).html() ); > > > }) > > > On Sep 24, 5:32 pm, osu wrote: > > >> Thanks Andi, > > >> Yes, I meant an unordered list as you showed. > > >> Rather than remove the tag, is it possible to just 'deactivate' > >> it? i.e. when you click it, nothing happens, but the tag stays > >> in > >> place? > >
[jQuery] Re: Deactivating parent link with JQuery
It all works fine, except for this bit $("li ul").siblings("a").click(function(){ return false; }); there are no a tag siblings of the UL, so that will not work. I've just tested it, and when I click on a subnav link, the class is added to the LI containing Link 3, if you need it to be added to the a tag use this $("li a").click(function(){ $(this).parents("ul").parents("li").children("a").addClass("nav-selected"); }); osu wrote: Hi Liam, This is the list I'm working with: Link 1 Link 2 Link 3 Link 3a Link 3b Link 3c Link 4 I need to add the class 'nav-selected' to Link 3 so I can highlight it using the same CSS as used to style Link 3a (the active link in the example above). As you can see, Link 1 has a class of 'nav-path- selected', so I need to differentiate between that and Link 3 (hence why I want to add a 'nav-selected' class to Link 3) The JQuery I've added to the footer of my page is: // But nothing is happening...no JS errors in Firebug either - any ideas? Thanks for your patience, osu On Sep 29, 11:07 am, Liam Potter wrote: I'm assuming you posted an example list and the real list does contain a tags? I'm also assuming you are running that script with a document ready handler? osu wrote: Thanks Liam, but that's not working... Not sure why .click is in your example? Am I right in thinking by adding .parents to the end of each tag in your example that you're 'going down' different levels in the unordered list? This is what I have: $("li a").click(function(){ $(this).parents("ul").parents("li").addClass("nav-selected"); }); Any ideas what's going wrong? On Sep 29, 10:29 am, Liam Potter wrote: $("li a").click(function(){ $(this).parents("ul").parents("li").addClass("className"); }); osu wrote: Hi Ryan, That only affects the child of theparent. What I want to do is this: Link 1 Link 2 *This is the link I want to add a class to* Link 2a Link 2b *This is the active link* Link 2c Link 3 Rather than affecting a descendent/child of theparentlink, I need to work on the *parentlink* under which the active link is found. Any ideas? Thanks, osu On Sep 26, 7:48 pm, "ryan.j" wrote: $('.nav-selected:first') On Sep 26, 5:36 pm, osu wrote: Can anyone help with this one please? Thanks, osu On Sep 25, 2:03 pm, osu wrote: Thanks Ryan for the alternative, However, I need to do the following now (see message above your last post): I need to highlight *only* the top-parentitem (the same one I just ran 'return false;' on) with the class 'nav-selected'. Any idea how I could do that? Thanks, osu On Sep 25, 11:13 am, "ryan.j" wrote: rather than removing the href you could use the preventDefault function, which will leave the href intact should you want to unbind it at a later date. usage is something like.. $('a.submit-button').click(function(e){ e.preventDefault(); doSubmit( $(this).html() ); }) On Sep 24, 5:32 pm, osu wrote: Thanks Andi, Yes, I meant an unordered list as you showed. Rather than remove the tag, is it possible to just 'deactivate' it? i.e. when you click it, nothing happens, but the tag stays in place? I ask, because I'd like to keep the CSS as simple as possible. Thanks, osu On Sep 24, 6:05 pm, Andi23 wrote: First of all, let's clarify the actual HTML. I assume this is what you have: Link 1 Link 2 Link 3 Link 3a Link 3b Link 3c Link 4 When you say "remove the link", I assume you want to turn this: Link 3 into this: Link 3 Given that, try this jQuery: $("li ul").siblings("a").each(function(){ $(this).replaceWith($(this).html()); });
[jQuery] Re: Deactivating parent link with JQuery
Hi Liam, This is the list I'm working with: Link 1 Link 2 Link 3 Link 3a Link 3b Link 3c Link 4 I need to add the class 'nav-selected' to Link 3 so I can highlight it using the same CSS as used to style Link 3a (the active link in the example above). As you can see, Link 1 has a class of 'nav-path- selected', so I need to differentiate between that and Link 3 (hence why I want to add a 'nav-selected' class to Link 3) The JQuery I've added to the footer of my page is: // But nothing is happening...no JS errors in Firebug either - any ideas? Thanks for your patience, osu On Sep 29, 11:07 am, Liam Potter wrote: > I'm assuming you posted an example list and the real list does contain a > tags? I'm also assuming you are running that script with a document > ready handler? > > osu wrote: > > Thanks Liam, but that's not working... > > > Not sure why .click is in your example? Am I right in thinking by > > adding .parents to the end of each tag in your example that you're > > 'going down' different levels in the unordered list? > > > This is what I have: > > > $("li a").click(function(){ > > $(this).parents("ul").parents("li").addClass("nav-selected"); > > }); > > > Any ideas what's going wrong? > > > On Sep 29, 10:29 am, Liam Potter wrote: > > >> $("li a").click(function(){ > >> $(this).parents("ul").parents("li").addClass("className"); > > >> }); > >> osu wrote: > > >>> Hi Ryan, > > >>> That only affects the child of theparent. > > >>> What I want to do is this: > > >>> > >>> Link 1 > >>> Link 2 *This is the link I want to add a class to* > >>> > >>> Link 2a > >>> Link 2b *This is the active link* > >>> Link 2c > >>> > >>> > >>> Link 3 > >>> > > >>> Rather than affecting a descendent/child of theparentlink, I need to > >>> work on the *parentlink* under which the active link is found. > > >>> Any ideas? > > >>> Thanks, > > >>> osu > > >>> On Sep 26, 7:48 pm, "ryan.j" wrote: > > $('.nav-selected:first') > > On Sep 26, 5:36 pm, osu wrote: > > > Can anyone help with this one please? > > > Thanks, > > > osu > > > On Sep 25, 2:03 pm, osu wrote: > > >> Thanks Ryan for the alternative, > > >> However, I need to do the following now (see message above your last > >> post): > > >> I need to highlight *only* the top-parentitem (the same one I just > >> ran 'return false;' on) with the class 'nav-selected'. > > >> Any idea how I could do that? > > >> Thanks, > > >> osu > > >> On Sep 25, 11:13 am, "ryan.j" wrote: > > >>> rather than removing the href you could use the preventDefault > >>> function, which will leave the href intact should you want to unbind > >>> it at a later date. > > >>> usage is something like.. > > >>> $('a.submit-button').click(function(e){ > >>> e.preventDefault(); > >>> doSubmit( $(this).html() ); > > >>> }) > > >>> On Sep 24, 5:32 pm, osu wrote: > > Thanks Andi, > > Yes, I meant an unordered list as you showed. > > Rather than remove the tag, is it possible to just 'deactivate' > it? i.e. when you click it, nothing happens, but the tag stays in > place? > > I ask, because I'd like to keep the CSS as simple as possible. > > Thanks, > > osu > > On Sep 24, 6:05 pm, Andi23 wrote: > > > First of all, let's clarify the actual HTML. I assume this is what > > you have: > > > > Link 1 > > Link 2 > > Link 3 > > > > Link 3a > > Link 3b > > Link 3c > > > > > > Link 4 > > > > > When you say "remove the link", I assume you want to turn this: > > Link 3 > > into this: > > Link 3 > > > Given that, try this jQuery: > > $("li ul").siblings("a").each(function(){ > > $(this).replaceWith($(this).html()); > > > });
[jQuery] Re: Deactivating parent link with JQuery
I'm assuming you posted an example list and the real list does contain a tags? I'm also assuming you are running that script with a document ready handler? osu wrote: Thanks Liam, but that's not working... Not sure why .click is in your example? Am I right in thinking by adding .parents to the end of each tag in your example that you're 'going down' different levels in the unordered list? This is what I have: $("li a").click(function(){ $(this).parents("ul").parents("li").addClass("nav-selected"); }); Any ideas what's going wrong? On Sep 29, 10:29 am, Liam Potter wrote: $("li a").click(function(){ $(this).parents("ul").parents("li").addClass("className"); }); osu wrote: Hi Ryan, That only affects the child of theparent. What I want to do is this: Link 1 Link 2 *This is the link I want to add a class to* Link 2a Link 2b *This is the active link* Link 2c Link 3 Rather than affecting a descendent/child of theparentlink, I need to work on the *parentlink* under which the active link is found. Any ideas? Thanks, osu On Sep 26, 7:48 pm, "ryan.j" wrote: $('.nav-selected:first') On Sep 26, 5:36 pm, osu wrote: Can anyone help with this one please? Thanks, osu On Sep 25, 2:03 pm, osu wrote: Thanks Ryan for the alternative, However, I need to do the following now (see message above your last post): I need to highlight *only* the top-parentitem (the same one I just ran 'return false;' on) with the class 'nav-selected'. Any idea how I could do that? Thanks, osu On Sep 25, 11:13 am, "ryan.j" wrote: rather than removing the href you could use the preventDefault function, which will leave the href intact should you want to unbind it at a later date. usage is something like.. $('a.submit-button').click(function(e){ e.preventDefault(); doSubmit( $(this).html() ); }) On Sep 24, 5:32 pm, osu wrote: Thanks Andi, Yes, I meant an unordered list as you showed. Rather than remove the tag, is it possible to just 'deactivate' it? i.e. when you click it, nothing happens, but the tag stays in place? I ask, because I'd like to keep the CSS as simple as possible. Thanks, osu On Sep 24, 6:05 pm, Andi23 wrote: First of all, let's clarify the actual HTML. I assume this is what you have: Link 1 Link 2 Link 3 Link 3a Link 3b Link 3c Link 4 When you say "remove the link", I assume you want to turn this: Link 3 into this: Link 3 Given that, try this jQuery: $("li ul").siblings("a").each(function(){ $(this).replaceWith($(this).html()); });
[jQuery] Re: Deactivating parent link with JQuery
Thanks Liam, but that's not working... Not sure why .click is in your example? Am I right in thinking by adding .parents to the end of each tag in your example that you're 'going down' different levels in the unordered list? This is what I have: $("li a").click(function(){ $(this).parents("ul").parents("li").addClass("nav-selected"); }); Any ideas what's going wrong? On Sep 29, 10:29 am, Liam Potter wrote: > $("li a").click(function(){ > $(this).parents("ul").parents("li").addClass("className"); > > }); > osu wrote: > > Hi Ryan, > > > That only affects the child of theparent. > > > What I want to do is this: > > > > > Link 1 > > Link 2 *This is the link I want to add a class to* > > > > Link 2a > > Link 2b *This is the active link* > > Link 2c > > > > > > Link 3 > > > > > Rather than affecting a descendent/child of theparentlink, I need to > > work on the *parentlink* under which the active link is found. > > > Any ideas? > > > Thanks, > > > osu > > > On Sep 26, 7:48 pm, "ryan.j" wrote: > > >> $('.nav-selected:first') > > >> On Sep 26, 5:36 pm, osu wrote: > > >>> Can anyone help with this one please? > > >>> Thanks, > > >>> osu > > >>> On Sep 25, 2:03 pm, osu wrote: > > Thanks Ryan for the alternative, > > However, I need to do the following now (see message above your last > post): > > I need to highlight *only* the top-parentitem (the same one I just > ran 'return false;' on) with the class 'nav-selected'. > > Any idea how I could do that? > > Thanks, > > osu > > On Sep 25, 11:13 am, "ryan.j" wrote: > > > rather than removing the href you could use the preventDefault > > function, which will leave the href intact should you want to unbind > > it at a later date. > > > usage is something like.. > > > $('a.submit-button').click(function(e){ > > e.preventDefault(); > > doSubmit( $(this).html() ); > > > }) > > > On Sep 24, 5:32 pm, osu wrote: > > >> Thanks Andi, > > >> Yes, I meant an unordered list as you showed. > > >> Rather than remove the tag, is it possible to just 'deactivate' > >> it? i.e. when you click it, nothing happens, but the tag stays in > >> place? > > >> I ask, because I'd like to keep the CSS as simple as possible. > > >> Thanks, > > >> osu > > >> On Sep 24, 6:05 pm, Andi23 wrote: > > >>> First of all, let's clarify the actual HTML. I assume this is what > >>> you have: > >>> > >>> Link 1 > >>> Link 2 > >>> Link 3 > >>> > >>> Link 3a > >>> Link 3b > >>> Link 3c > >>> > >>> > >>> Link 4 > >>> > > >>> When you say "remove the link", I assume you want to turn this: > >>> Link 3 > >>> into this: > >>> Link 3 > > >>> Given that, try this jQuery: > >>> $("li ul").siblings("a").each(function(){ > >>> $(this).replaceWith($(this).html()); > > >>> });
[jQuery] Re: Deactivating parent link with JQuery
$("li a").click(function(){ $(this).parents("ul").parents("li").addClass("className"); }); osu wrote: Hi Ryan, That only affects the child of the parent. What I want to do is this: Link 1 Link 2 *This is the link I want to add a class to* Link 2a Link 2b *This is the active link* Link 2c Link 3 Rather than affecting a descendent/child of the parent link, I need to work on the *parent link* under which the active link is found. Any ideas? Thanks, osu On Sep 26, 7:48 pm, "ryan.j" wrote: $('.nav-selected:first') On Sep 26, 5:36 pm, osu wrote: Can anyone help with this one please? Thanks, osu On Sep 25, 2:03 pm, osu wrote: Thanks Ryan for the alternative, However, I need to do the following now (see message above your last post): I need to highlight *only* the top-parentitem (the same one I just ran 'return false;' on) with the class 'nav-selected'. Any idea how I could do that? Thanks, osu On Sep 25, 11:13 am, "ryan.j" wrote: rather than removing the href you could use the preventDefault function, which will leave the href intact should you want to unbind it at a later date. usage is something like.. $('a.submit-button').click(function(e){ e.preventDefault(); doSubmit( $(this).html() ); }) On Sep 24, 5:32 pm, osu wrote: Thanks Andi, Yes, I meant an unordered list as you showed. Rather than remove the tag, is it possible to just 'deactivate' it? i.e. when you click it, nothing happens, but the tag stays in place? I ask, because I'd like to keep the CSS as simple as possible. Thanks, osu On Sep 24, 6:05 pm, Andi23 wrote: First of all, let's clarify the actual HTML. I assume this is what you have: Link 1 Link 2 Link 3 Link 3a Link 3b Link 3c Link 4 When you say "remove the link", I assume you want to turn this: Link 3 into this: Link 3 Given that, try this jQuery: $("li ul").siblings("a").each(function(){ $(this).replaceWith($(this).html()); });
[jQuery] Re: Deactivating parent link with JQuery
Hi Ryan, That only affects the child of the parent. What I want to do is this: Link 1 Link 2 *This is the link I want to add a class to* Link 2a Link 2b *This is the active link* Link 2c Link 3 Rather than affecting a descendent/child of the parent link, I need to work on the *parent link* under which the active link is found. Any ideas? Thanks, osu On Sep 26, 7:48 pm, "ryan.j" wrote: > $('.nav-selected:first') > > On Sep 26, 5:36 pm, osu wrote: > > > Can anyone help with this one please? > > > Thanks, > > > osu > > > On Sep 25, 2:03 pm, osu wrote: > > > > Thanks Ryan for the alternative, > > > > However, I need to do the following now (see message above your last > > > post): > > > > I need to highlight *only* the top-parentitem (the same one I just > > > ran 'return false;' on) with the class 'nav-selected'. > > > > Any idea how I could do that? > > > > Thanks, > > > > osu > > > > On Sep 25, 11:13 am, "ryan.j" wrote: > > > > > rather than removing the href you could use the preventDefault > > > > function, which will leave the href intact should you want to unbind > > > > it at a later date. > > > > > usage is something like.. > > > > > $('a.submit-button').click(function(e){ > > > > e.preventDefault(); > > > > doSubmit( $(this).html() ); > > > > > }) > > > > > On Sep 24, 5:32 pm, osu wrote: > > > > > > Thanks Andi, > > > > > > Yes, I meant an unordered list as you showed. > > > > > > Rather than remove the tag, is it possible to just 'deactivate' > > > > > it? i.e. when you click it, nothing happens, but the tag stays in > > > > > place? > > > > > > I ask, because I'd like to keep the CSS as simple as possible. > > > > > > Thanks, > > > > > > osu > > > > > > On Sep 24, 6:05 pm, Andi23 wrote: > > > > > > > First of all, let's clarify the actual HTML. I assume this is what > > > > > > you have: > > > > > > > > > > > > Link 1 > > > > > > Link 2 > > > > > > Link 3 > > > > > > > > > > > > Link 3a > > > > > > Link 3b > > > > > > Link 3c > > > > > > > > > > > > > > > > > > Link 4 > > > > > > > > > > > > > When you say "remove the link", I assume you want to turn this: > > > > > > Link 3 > > > > > > into this: > > > > > > Link 3 > > > > > > > Given that, try this jQuery: > > > > > > $("li ul").siblings("a").each(function(){ > > > > > > $(this).replaceWith($(this).html()); > > > > > > > });
[jQuery] Re: Deactivating parent link with JQuery
$('.nav-selected:first') On Sep 26, 5:36 pm, osu wrote: > Can anyone help with this one please? > > Thanks, > > osu > > On Sep 25, 2:03 pm, osu wrote: > > > Thanks Ryan for the alternative, > > > However, I need to do the following now (see message above your last > > post): > > > I need to highlight *only* the top-parentitem (the same one I just > > ran 'return false;' on) with the class 'nav-selected'. > > > Any idea how I could do that? > > > Thanks, > > > osu > > > On Sep 25, 11:13 am, "ryan.j" wrote: > > > > rather than removing the href you could use the preventDefault > > > function, which will leave the href intact should you want to unbind > > > it at a later date. > > > > usage is something like.. > > > > $('a.submit-button').click(function(e){ > > > e.preventDefault(); > > > doSubmit( $(this).html() ); > > > > }) > > > > On Sep 24, 5:32 pm, osu wrote: > > > > > Thanks Andi, > > > > > Yes, I meant an unordered list as you showed. > > > > > Rather than remove the tag, is it possible to just 'deactivate' > > > > it? i.e. when you click it, nothing happens, but the tag stays in > > > > place? > > > > > I ask, because I'd like to keep the CSS as simple as possible. > > > > > Thanks, > > > > > osu > > > > > On Sep 24, 6:05 pm, Andi23 wrote: > > > > > > First of all, let's clarify the actual HTML. I assume this is what > > > > > you have: > > > > > > > > > > Link 1 > > > > > Link 2 > > > > > Link 3 > > > > > > > > > > Link 3a > > > > > Link 3b > > > > > Link 3c > > > > > > > > > > > > > > > Link 4 > > > > > > > > > > > When you say "remove the link", I assume you want to turn this: > > > > > Link 3 > > > > > into this: > > > > > Link 3 > > > > > > Given that, try this jQuery: > > > > > $("li ul").siblings("a").each(function(){ > > > > > $(this).replaceWith($(this).html()); > > > > > > });
[jQuery] Re: Deactivating parent link with JQuery
Can anyone help with this one please? Thanks, osu On Sep 25, 2:03 pm, osu wrote: > Thanks Ryan for the alternative, > > However, I need to do the following now (see message above your last > post): > > I need to highlight *only* the top-parentitem (the same one I just > ran 'return false;' on) with the class 'nav-selected'. > > Any idea how I could do that? > > Thanks, > > osu > > On Sep 25, 11:13 am, "ryan.j" wrote: > > > rather than removing the href you could use the preventDefault > > function, which will leave the href intact should you want to unbind > > it at a later date. > > > usage is something like.. > > > $('a.submit-button').click(function(e){ > > e.preventDefault(); > > doSubmit( $(this).html() ); > > > }) > > > On Sep 24, 5:32 pm, osu wrote: > > > > Thanks Andi, > > > > Yes, I meant an unordered list as you showed. > > > > Rather than remove the tag, is it possible to just 'deactivate' > > > it? i.e. when you click it, nothing happens, but the tag stays in > > > place? > > > > I ask, because I'd like to keep the CSS as simple as possible. > > > > Thanks, > > > > osu > > > > On Sep 24, 6:05 pm, Andi23 wrote: > > > > > First of all, let's clarify the actual HTML. I assume this is what > > > > you have: > > > > > > > > Link 1 > > > > Link 2 > > > > Link 3 > > > > > > > > Link 3a > > > > Link 3b > > > > Link 3c > > > > > > > > > > > > Link 4 > > > > > > > > > When you say "remove the link", I assume you want to turn this: > > > > Link 3 > > > > into this: > > > > Link 3 > > > > > Given that, try this jQuery: > > > > $("li ul").siblings("a").each(function(){ > > > > $(this).replaceWith($(this).html()); > > > > > });
[jQuery] Re: Deactivating parent link with JQuery
Thanks Ryan for the alternative, However, I need to do the following now (see message above your last post): I need to highlight *only* the top-parent item (the same one I just ran 'return false;' on) with the class 'nav-selected'. Any idea how I could do that? Thanks, osu On Sep 25, 11:13 am, "ryan.j" wrote: > rather than removing the href you could use the preventDefault > function, which will leave the href intact should you want to unbind > it at a later date. > > usage is something like.. > > $('a.submit-button').click(function(e){ > e.preventDefault(); > doSubmit( $(this).html() ); > > }) > > On Sep 24, 5:32 pm, osu wrote: > > > Thanks Andi, > > > Yes, I meant an unordered list as you showed. > > > Rather than remove the tag, is it possible to just 'deactivate' > > it? i.e. when you click it, nothing happens, but the tag stays in > > place? > > > I ask, because I'd like to keep the CSS as simple as possible. > > > Thanks, > > > osu > > > On Sep 24, 6:05 pm, Andi23 wrote: > > > > First of all, let's clarify the actual HTML. I assume this is what > > > you have: > > > > > > Link 1 > > > Link 2 > > > Link 3 > > > > > > Link 3a > > > Link 3b > > > Link 3c > > > > > > > > > Link 4 > > > > > > > When you say "remove the link", I assume you want to turn this: > > > Link 3 > > > into this: > > > Link 3 > > > > Given that, try this jQuery: > > > $("li ul").siblings("a").each(function(){ > > > $(this).replaceWith($(this).html()); > > > > });
[jQuery] Re: Deactivating parent link with JQuery
rather than removing the href you could use the preventDefault function, which will leave the href intact should you want to unbind it at a later date. usage is something like.. $('a.submit-button').click(function(e){ e.preventDefault(); doSubmit( $(this).html() ); }) On Sep 24, 5:32 pm, osu wrote: > Thanks Andi, > > Yes, I meant an unordered list as you showed. > > Rather than remove the tag, is it possible to just 'deactivate' > it? i.e. when you click it, nothing happens, but the tag stays in > place? > > I ask, because I'd like to keep the CSS as simple as possible. > > Thanks, > > osu > > On Sep 24, 6:05 pm, Andi23 wrote: > > > First of all, let's clarify the actual HTML. I assume this is what > > you have: > > > > Link 1 > > Link 2 > > Link 3 > > > > Link 3a > > Link 3b > > Link 3c > > > > > > Link 4 > > > > > When you say "remove the link", I assume you want to turn this: > > Link 3 > > into this: > > Link 3 > > > Given that, try this jQuery: > > $("li ul").siblings("a").each(function(){ > > $(this).replaceWith($(this).html()); > > > });
[jQuery] Re: Deactivating parent link with JQuery
Anyone? Thanks osu On Sep 24, 9:26 pm, osu wrote: > Ok, I have another question that's related to the first. > > I need to highlight *only* the top-parent item (the same one I just > ran 'return false;' on) with the class 'nav-selected'. > > This is the code that's being generated by the CMS I'm working with > when I click on Link 3a: > > > Link 1 > Link 2 > Link 3 > > Link 3a > Link 3b > Link 3c > > > Link 4 > > > I've got this: > > if($("#nav li:first").hasClass("nav-path-selected").siblings("a")) > // Add nav-selected class to parent li with children > $(".nav-path-selected").addClass("nav-selected"); > > }; > > But it's not working for me. I'm *only* trying to affect the parent > of the list that has a child active in it. > > Do you know how I can do that? Thanks for all your help so far, really > is appreciated. > > osu > > On Sep 24, 8:18 pm, osu wrote: > > > That's perfect, thanks for that - the second example works a treat. > > > osu > > > On Sep 24, 7:10 pm, Andi23 wrote: > > > > In that case, you can just remove the href attribute of the link(s): > > > $("li ul").siblings("a").removeAttr("href"); > > > > or, if you want to leave in the href attribute for future use?, you > > > can do this: > > > $("li ul").siblings("a").click(function(){ > > > return false; > > > > }); > > > > good luck-
[jQuery] Re: Deactivating parent link with JQuery
Ok, I have another question that's related to the first. I need to highlight *only* the top-parent item (the same one I just ran 'return false;' on) with the class 'nav-selected'. This is the code that's being generated by the CMS I'm working with when I click on Link 3a: Link 1 Link 2 Link 3 Link 3a Link 3b Link 3c Link 4 I've got this: if($("#nav li:first").hasClass("nav-path-selected").siblings("a")) // Add nav-selected class to parent li with children $(".nav-path-selected").addClass("nav-selected"); }; But it's not working for me. I'm *only* trying to affect the parent of the list that has a child active in it. Do you know how I can do that? Thanks for all your help so far, really is appreciated. osu On Sep 24, 8:18 pm, osu wrote: > That's perfect, thanks for that - the second example works a treat. > > osu > > On Sep 24, 7:10 pm, Andi23 wrote: > > > In that case, you can just remove the href attribute of the link(s): > > $("li ul").siblings("a").removeAttr("href"); > > > or, if you want to leave in the href attribute for future use?, you > > can do this: > > $("li ul").siblings("a").click(function(){ > > return false; > > > }); > > > good luck-
[jQuery] Re: Deactivating parent link with JQuery
That's perfect, thanks for that - the second example works a treat. osu On Sep 24, 7:10 pm, Andi23 wrote: > In that case, you can just remove the href attribute of the link(s): > $("li ul").siblings("a").removeAttr("href"); > > or, if you want to leave in the href attribute for future use?, you > can do this: > $("li ul").siblings("a").click(function(){ > return false; > > }); > > good luck-
[jQuery] Re: Deactivating parent link with JQuery
In that case, you can just remove the href attribute of the link(s): $("li ul").siblings("a").removeAttr("href"); or, if you want to leave in the href attribute for future use?, you can do this: $("li ul").siblings("a").click(function(){ return false; }); good luck-
[jQuery] Re: Deactivating parent link with JQuery
Thanks Andi, Yes, I meant an unordered list as you showed. Rather than remove the tag, is it possible to just 'deactivate' it? i.e. when you click it, nothing happens, but the tag stays in place? I ask, because I'd like to keep the CSS as simple as possible. Thanks, osu On Sep 24, 6:05 pm, Andi23 wrote: > First of all, let's clarify the actual HTML. I assume this is what > you have: > > Link 1 > Link 2 > Link 3 > > Link 3a > Link 3b > Link 3c > > > Link 4 > > > When you say "remove the link", I assume you want to turn this: > Link 3 > into this: > Link 3 > > Given that, try this jQuery: > $("li ul").siblings("a").each(function(){ > $(this).replaceWith($(this).html()); > > });
[jQuery] Re: Deactivating parent link with JQuery
First of all, let's clarify the actual HTML. I assume this is what you have: Link 1 Link 2 Link 3 Link 3a Link 3b Link 3c Link 4 When you say "remove the link", I assume you want to turn this: Link 3 into this: Link 3 Given that, try this jQuery: $("li ul").siblings("a").each(function(){ $(this).replaceWith($(this).html()); });