很多網(wǎng)站為了去除超鏈接外面的虛框(非IE很多是實(shí)框),在每個(gè)超鏈接標(biāo)簽上面都寫上了惡心的
onfocus="this.blur()"
這樣就導(dǎo)致整個(gè)網(wǎng)站人為的變成有障礙網(wǎng)站了,任何無法使用鼠標(biāo)的用戶也就無法正常使用這個(gè)網(wǎng)站,因?yàn)殒I盤不能聚焦到超鏈接上。
修復(fù)這個(gè)問題很簡單,用
hideFocus或者
style="outine:none"來代替
onfocus="this.blur()"就好了,但是有的時(shí)候網(wǎng)站頁面太多,全站修改代價(jià)就大了。這種情況下可以在網(wǎng)站的模板或者通用腳本上面插入以下一段腳本來解決問題:
setTimeout(
(function(){
var a=document.getElementsByTagName("A");
var regBlur=/^function ((anonymous)|(onfocus))?\((event)?\)\s*\{\s*(this\.)?blur\(\);?\s*\}$/;
var isIE=("\v"=="v");
for(var i=0;i<a.length;i++){
if(regBlur.test(a[i].onfocus)){
if(isIE){
a[i].hideFocus="true";
}else{
a[i].style.outline="none"
}
a[i].onfocus=null;
}
}
}),1000)
是不是很簡單啊。
這段代碼對(duì)于opera瀏覽器不兼容,因?yàn)閛pera瀏覽器本身就不是一個(gè)信息無障礙的瀏覽器,沒有視障用戶用opera的,大家都來鄙視opera吧。
平安夜那天早上,晴天反饋說有一些網(wǎng)站不是直接寫onfocus事件,而是用attachEvent/addEventListener方式寫了惡心的this.blur()。這事咋整呢?沒有拿到原來綁定上面的函數(shù)句柄,就不能detachEvent啊。最終想了一個(gè)跟blur差不多一樣惡心的hack:
<html>
<head>
<body>
<a href="#" onclick="alert('click1')">test1</a>
<a href="http://www.qq.com/" >qq</a>
<a href="http://www.baidu.com/" >baidu</a>
<script type="text/javascript">
<!--
var ls=document.links;
//這是原來讓鏈接不能聚焦的代碼
for(var i=0;i<ls.length;i++){
ls[i].attachEvent("onfocus",function(){this.blur()})
}
//這是讓鏈接重新可以聚焦的代碼
for(var i=0;i<ls.length;i++){
var a=document.createElement("A");
a.innerHTML=ls[i].innerHTML;
ls[i].innerHTML="";
ls[i].appendChild(a);
a.tabIndex=0;
ls[i].tabIndex=-1;
}
//-->
</script>
</body>
</html>
這樣可以解決大部分類似這樣的問題,也可以代替上面的方案,不過有一些副作用。考慮到大多數(shù)情況下超鏈接標(biāo)簽內(nèi)部的內(nèi)容結(jié)構(gòu)都比較簡單,也不會(huì)有太多的內(nèi)部事件綁定的情況,這段代碼應(yīng)該可以應(yīng)付大多數(shù)情形了。