Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to disable an anchor (link) tag (convert to span)

I have a bunch of anchor tags (<a>) that I need to convert to <span> tags. I don't need to do this to disable clicking (I know about preventDefault() and returning false from the click event handler). I just need to do this to enable drag and drop sorting (which IE forbids on an anchor tag but permits on a span).

I have a working solution that is fine.

http://jsfiddle.net/5HGbx/

I'm just wondering if any of you wizards have a slicker way of achieving the same end result.

like image 571
Peter Lyons Avatar asked Jul 10 '11 06:07

Peter Lyons


People also ask

Can you disable an anchor tag?

Disable HTML Anchor Tag with CSSThe best way to disable a link tag is by using the CSS property pointer-events: none; . When you apply pointer-events: none; to any element, all click events will be disabled. Because it applies to any element, you can use it to disable an anchor tag.

How do I disable a tag link?

Disable a link # It is still possible to disable a link by following 3 steps: remove the href attribute so that it can no longer receive the focus. add a role="link" so that it is always considered a link by screen readers. add an attribute aria-disabled="true" so that it is indicated as being disabled.

Can we use anchor tag in span?

Personally, as a web developer, I only ever put a span within an anchor tag if I am trying to highlight a section of the links text, such as applying a background to one section. Save this answer. Show activity on this post. It will work both, but personally I'd prefer option 2 so the span is "around" the link.


1 Answers

you could use replaceWith from jQuery API

$('#myButton').click(function(){
    $("#someDiv a").replaceWith(function(){
        return $("<span>" + $(this).html() + "</span>");
    });
});

Fiddle here: http://jsfiddle.net/naveen/ufYCt/1/

like image 146
naveen Avatar answered Oct 06 '22 01:10

naveen