Disable link using javascript

Question

I have following HTML and would like to disable the link using javascript.

<a style="white-space: nowrap;" onclick="return InstallWebApp(true);" id="uc_ii_lnkInstall" href="javascript:__doPostBack('uc_ii$lnkInstall','')">
<img style="border-width: 0pt; margin-right: 3px;" id="uc_ii_lnkInstallImg" alt="Install" title="Install" src="/CortexDotNet/pics/buttons/install_g.gif">
Install
</a>

The JavaScript I am using are :

  document.getElementById("uc_ii_lnkInstall").disabled = true;

However , it does not work , I could still click this this link after I have disabled the link using the above javascript.I look at the html , it does not seem to have the disable attribute in the a tag.Can anyone help me to explain this please?

Solution 1

document.getElementById("uc_ii_lnkInstall").onclick = function() { return false; };

The return value of false in the old-style event handler prevents the default action (i.e. loading the javascript: URL).

If you want to gray out the image link, you would also need to swap out the image's src URL with one pointing to a grayed-out version of the icon and change the text's color using .style.color = "gray";.

Solution 2

I don't think the 'disable' attribute will work on links, it work mostly on form elements such as inputs, textarea, button, etc.

But as @idealmachine said normal links <a> can be disabled by returning false 'return false' in javascript/jquery.