How to disable anchor using JavaScript? [duplicate]

Question

I have to disable anchor link depending on a condition if some data comes to that field it should work as a hyperlink and if that data does not come then the link should not be there? Any ideas on this are welcome.

Answer 1

Case 1:

To disable:

document.getElementById(id).style.pointerEvents="none";
document.getElementById(id).style.cursor="default";

To enable:

document.getElementById(id).style.pointerEvents="auto";
document.getElementById(id).style.cursor="pointer";

Case 2:

If you want the link to be gone (not just disable it):

document.getElementById(id).style.display="none";

to get it back:

document.getElementById(id).style.display="block"; //change block to what you want.

Case 3:

If you want to hide it preserving the space for it:

document.getElementById(id).style.visibility="hidden";

To get it back:

document.getElementById(id).style.visibility="visible";

Answer 2

I couldn't make sense of your question body, so I'll answer your question's title...

How to disable anchor using javascript ?

JavaScript

if (condition) {
    document.getElementsByTagName('a')[0].removeAttribute('href');
}

jQuery

...because everyone uses it, right?

if (condition) {
    $('a').first().removeAttr('href');
}