代码之家  ›  专栏  ›  技术社区  ›  adardesign

触发键盘事件,WebKit键盘事件不触发

  •  2
  • adardesign  · 技术社区  · 14 年前

    我有一个javascript代码,它监听按下的“返回”键,
    适用于除WebKit浏览器以外的所有浏览器 .

    我知道Webkits最近 changes to keyboard event handling .
    我找不到正确的解决方案 in this detailed explanation .

    这里是 code .

    function addEventHandler(node,type,fn){
       if(typeof window.event !== "undefined"){
                /* Internet Explorer way */
                node.attachEvent( "on" + type, fn );
       } else {
               /* FF & Other Browsers */
               node.addEventListener( type, fn,false );
       }
    } 
    
    
    function detectSubmit(){
        searchTextInput = document.getElementById("txtSearch")
        addEventHandler(searchTextInput,"keydown",triggerSearch);
    }
    
    function triggerSearch(e){
      //getting the character that was pressed cross browser. 
         var key = e.keycode ? e.keycode : e.which;
      //detect if the return key was pressed. 
        if(key==13){
          alert("return clicked");
        }
    }
    
       addEventHandler(window,"load",detectSubmit);
    
    1 回复  |  直到 12 年前
        1
  •  2
  •   Tim Down    14 年前

    最明显的是下面这行的简单拼写错误:

    var key = e.keycode ? e.keycode : e.which;
    

    应该是 keyCode 而不是 keycode .

    除此之外,在 addEventHandler 功能。我建议如下:

    function addEventHandler(node,type,fn){
        if (typeof node.addEventListener !== "undefined"){
            /* DOM-compliant method */
            node.addEventListener( type, fn,false );
        } else if (typeof node.attachEvent !== "undefined") {
            /* IE */
            node.attachEvent( "on" + type, fn );
        }
    }
    

    有两件事:首先,最好检查一下 attachEvent 直接而不是从 window.event . 事实上, 窗口事件 存在于Safari和Chrome中,但不存在(我认为) 附加事件 因此,不可靠的推理会阻止代码工作。

    其次,最好检查DOM标准 addEventListener 首先,在它存在的地方使用它,而不是 附加事件 . 例如,歌剧既有,也只有 添加事件侦听器 是标准化的。