0

I have a list of 4 links that I would like to give tab like behaviour to.

When one link is clicked I would like to turn it into text only. Then when a different link is clicked it should turn back into a clickable link. This would prevent someone clicking it twice, and show them which link is active.

Code looks like this:

<a href="">Link One</a>
<a href="">Link Two</a>
<a href="">Link Three</a>
<a href="">Link Four</a>

2 Answers 2

1

Couldn't you just give it a class when it is clicked, e.g.

$('a').click(function(){
  if($(this).hasClass('active')) return; // this would stop any of the code below executing
  $('a').removeClass('active');
  $(this).addClass('active');
});

Then just give the active class a style which makes it look like text

2
  • (then just add all the other code that switches tabs, etc following in that click event function) Jun 12, 2011 at 19:11
  • That's a really elegant solution. Thank you!
    – Shealan
    Jun 12, 2011 at 19:24
0

A solution would be to have 2 elements for each link. One with the anchor tags and the other without them in plaintext.

You could then hide the one with anchor tags when u click it and then show the plaintext for that link.

(will put up the code for this soon)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.