<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    emu in blogjava

      BlogJava :: 首頁 :: 新隨筆 :: 聯(lián)系 :: 聚合  :: 管理 ::
      171 隨筆 :: 103 文章 :: 1052 評(píng)論 :: 2 Trackbacks
    很多網(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>
      
    <href="#" onclick="alert('click1')">test1</a>
      
    <href="http://www.qq.com/" >qq</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ù)情形了。
    posted on 2010-09-26 21:37 emu 閱讀(2847) 評(píng)論(2)  編輯  收藏

    評(píng)論

    # re: 信息無障礙的修復(fù)腳本 2011-02-15 14:15 jacelee
    其實(shí)沒有必要去除外框的虛線,如果去掉的話依賴鍵盤的用戶就無法判斷出焦點(diǎn)的位置  回復(fù)  更多評(píng)論
      

    # re: 信息無障礙的修復(fù)腳本 2011-08-17 15:12 回轉(zhuǎn)窯
    很專業(yè) 不錯(cuò) 謝謝分享  回復(fù)  更多評(píng)論
      


    只有注冊(cè)用戶登錄后才能發(fā)表評(píng)論。


    網(wǎng)站導(dǎo)航:
     
    主站蜘蛛池模板: 无码乱人伦一区二区亚洲| 久久久精品视频免费观看| 亚洲国产成人一区二区精品区 | 又黄又爽的视频免费看| 日本zzzzwww大片免费| a毛片免费播放全部完整| 国产AV无码专区亚洲AV麻豆丫| 亚洲福利电影在线观看| 亚洲精品国产成人片| 亚洲AⅤ视频一区二区三区| 成人免费一区二区三区在线观看| 3d成人免费动漫在线观看| 三级黄色免费观看| 免费看一级一级人妻片 | 白白国产永久免费视频| 成人AV免费网址在线观看| 120秒男女动态视频免费| 无码av免费网站| 免费福利电影在线观看| 国产一级a毛一级a看免费人娇| 免费国产a理论片| 美女黄频a美女大全免费皮| 亚洲AV无码之国产精品| 亚洲欧美第一成人网站7777| 国内精品久久久久影院亚洲| 亚洲三级视频在线| 亚洲人成片在线观看| 亚洲人妖女同在线播放| 亚洲人成网站日本片| 国产亚洲sss在线播放| 亚洲人成综合网站7777香蕉| 亚洲中文无码卡通动漫野外| 亚洲色偷偷综合亚洲AV伊人蜜桃 | 久久国产乱子伦精品免费看| 女人隐私秘视频黄www免费| a在线观看免费视频| 亚洲免费人成在线视频观看 | 亚洲美女大bbbbbbbbb| 精品亚洲aⅴ在线观看| 久久久久亚洲精品无码蜜桃 | 日本一区二区三区免费高清|