Tuesday, September 29, 2009

[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 <radioactiv...@gmail.com> 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:
>>>
>>> <ul>
>>> <li>Link 1</li>
>>> <li>Link 2 *This is the link I want to add a class to*
>>> <ul>
>>> <li>Link 2a</li>
>>> <li>Link 2b</li> *This is the active link*
>>> <li>Link 2c</li>
>>> </ul>
>>> </li>
>>> <li>Link 3</li>
>>> </ul>
>>>
>>> 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" <ryan.joyce...@googlemail.com> wrote:
>>>
>>>> $('.nav-selected:first')
>>>>
>>>> On Sep 26, 5:36 pm, osu <onesiz...@googlemail.com> wrote:
>>>>
>>>>> Can anyone help with this one please?
>>>>>
>>>>> Thanks,
>>>>>
>>>>> osu
>>>>>
>>>>> On Sep 25, 2:03 pm, osu <onesiz...@googlemail.com> 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" <ryan.joyce...@googlemail.com> 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 <onesiz...@googlemail.com> wrote:
>>>>>>>
>>>>>>>> Thanks Andi,
>>>>>>>>
>>>>>>>> Yes, I meant an unordered list as you showed.
>>>>>>>>
>>>>>>>> Rather than remove the <a> tag, is it possible to just 'deactivate'
>>>>>>>> it? i.e. when you click it, nothing happens, but the <a> 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 <dowhatyouw...@gmail.com> wrote:
>>>>>>>>
>>>>>>>>> First of all, let's clarify the actual HTML. I assume this is what
>>>>>>>>> you have:
>>>>>>>>> <ul>
>>>>>>>>> <li><a href="#">Link 1</a></li>
>>>>>>>>> <li><a href="#">Link 2</a></li>
>>>>>>>>> <li><a href="#">Link 3</a>
>>>>>>>>> <ul>
>>>>>>>>> <li><a href="#">Link 3a</a></li>
>>>>>>>>> <li><a href="#">Link 3b</a></li>
>>>>>>>>> <li><a href="#">Link 3c</a></li>
>>>>>>>>> </ul>
>>>>>>>>> </li>
>>>>>>>>> <li><a href="#">Link 4</a></li>
>>>>>>>>> </ul>
>>>>>>>>>
>>>>>>>>> When you say "remove the link", I assume you want to turn this:
>>>>>>>>> <li><a href="#">Link 3</a>
>>>>>>>>> into this:
>>>>>>>>> <li>Link 3
>>>>>>>>>
>>>>>>>>> Given that, try this jQuery:
>>>>>>>>> $("li ul").siblings("a").each(function(){
>>>>>>>>> $(this).replaceWith($(this).html());
>>>>>>>>>
>>>>>>>>> });
>>>>>>>>>

No comments: