IE IE and Firefox compatible javascript to enable or disable an anchor tag

最新推荐文章于 2025-11-24 00:49:10 发布

原创最新推荐文章于 2025-11-24 00:49:10 发布 · 196 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#IE #Firefox #JavaScript #.net #HTML #ViewUI

javascript 专栏收录该内容

13 篇文章

订阅专栏

本文介绍了在不同浏览器中实现锚点链接禁用效果的技术方案。通过移除或添加 href 属性来改变链接状态，同时调整样式以模拟禁用状态。适用于 IE 和 Firefox 浏览器。

[url=http://geekswithblogs.net/TimH/archive/2006/01/19/66396.aspx]http://geekswithblogs.net/TimH/archive/2006/01/19/66396.aspx[/url]

IE supports provides a half-baked implementation of the non-standard attribute 'disabled' on anchor tags (ie it changes it's color -even though it does not actually disable the anchor (if it has an href value). Firefox does not provide any support for it.

To add full 'disable' functionality to both browsers there are a couple of work arounds (hacks):

* Override the onclick event of the anchor (to do nothing) and override the visual settings.

or, more simply

* Add or remove the href attribute (both browsers will enable/disable the anchor with this method).

This causes both browsers to remove hyperlink behaviour: remove the underline, remove the hover mouse pointer (hand) and don't color the text blue. It does not, however cause the anchor to be greyed out (which you can easily do if you wish).

To allow this to work you need to store the existing href value - I just add another (non standard html) attribute eg href_bak.

Eg:

function disableAnchor(obj, disable){
  if(disable){
    var href = obj.getAttribute("href");
    if(href && href != "" && href != null){
       obj.setAttribute('href_bak', href);
    }
    obj.removeAttribute('href');
    obj.style.color="gray";
  }
  else{
    obj.setAttribute('href', obj.attributes['href_bak'].nodeValue);
    obj.style.color="blue";
  }
}