JS onkeypress相容性寫法詳解_javascript技巧

要求實現輸入密碼後按回車，觸發後台事件。看似十分簡單的需求，但卻碰到不少難題啊。

HTML內容中主要有一個密碼輸入文字框，還有一個按鈕，用來觸發後台事件。

1. TextBox文字方塊取得焦點後直接回車，頁面會刷新。
   經過程式碼仔細研究，原來是當頁面中只有一個文字方塊控制項時，當按下回車功能頁面將會刷新。
   處理方法：在頁面中加入一個隱藏的TextBox控制項。
   具體原理不明！

2. 用Jquery實作法：

 $(document).ready(function(){
  $("#tbPassword").focus();
  $('#bPassword').keydown(function(e){     
    if(e.keyCode == 13){ 
      $("#ctl00_ContentBody_btnAccept_linkButton")[0].click();
    }    
  });
  });

3. 因為種種原因不能採用Jquery的實作方法，只好改用JS，它的相容性就是一個最頭痛的問題了。

  document.getElementByIdx_x_x("tbPassword").onkeypress = function(event){
    var keynum;
    if(window.event) // IE
    {
     keynum = window.event.keyCode;
    }
    else if(event.which) // Netscape/Firefox/Opera
    {
     keynum = event.which;
    }
    
    if (keynum == 13)
      document.getElementByIdx_x_x('ctl00_ContentBody_btnAccept_linkButton').click();
  }

說明：

在IE下讀取鍵盤按鍵：

keynum = event.keyCode; // 字母d,keynum=100
    keychar = String.fromCharCode(keynum); // 将keynum转换成字符d

在FireFox中讀取鍵盤按鍵：   

 keynum = event.which; // 字母d,keynum=100
    keychar = String.fromCharCode(keynum); // 将keynum转换成字符d

如IE中，只有keyCode屬性，而FireFox中有which和charCode屬性，Opera中有keyCode和which屬性等。

因此，在Jquery中已經解決這種相容性問題。

以上就是本文的全部內容，希望對大家的學習有所幫助。