分享一段通过前端javascript脚本 启用/禁用超链接的代码
在做asp.net开发的时候,可能会经常用LinkButton,该控件最终会在客户端解析成超链接;
有的时候可能期望直接在客户端控制 该类button(即hyperlink)的可用与非可用。
一般我们会在客户端这样写:
<a href="javascript: doSomething()" class="button" id="abc">审核</a> 或者 <a href="#" onclick="doSomething(); return false;" class="button" id="xyz">审核</a>
在ie里面可以直接设置超链接的disabled属性为true,但是有两个问题:
1)disabled属性只有ie支持,其它浏览器(如firefox、Opera等)未必支持;
2)即使将disabled属性设置为true以后,在单击该超链接的似乎后,onclick事件仍然会执行;
因此出现了下面变通的方法,经试验,浏览器兼容性比较好,提供点小技巧供参考:
// 禁用、启用超链接
// @objId : 超链接ID
// @disable: true,禁用; false:启用
function disableAnchor(objId, disable) {
var obj = gId(objId);
if (disable) { // disable
var href = obj.getAttribute("href");
if (href && href != "" && href != null) {
obj.setAttribute('href_bak', href);
}
obj.removeAttribute('href');
// 处理onclick事件
var onclick = obj.getAttribute("onclick");
if(onclick != null){
obj.setAttribute('onclick_bak', onclick);
obj.setAttribute('onclick', "void(0);");
}
obj.onclick = null;
obj.style.color = "gray";
obj.setAttribute('disabled', 'disabled');
}
else { // enable
if (obj.attributes['href_bak'])
obj.setAttribute('href', obj.attributes['href_bak'].nodeValue);
if(obj.attributes['onclick_bak']!=null)
obj.setAttribute('onclick', obj.attributes['onclick_bak'].nodeValue);
obj.removeAttribute('style');
obj.removeAttribute('disabled');
}
}