分類  >  Web前端 >

概念onkeypress、onkeyup、onkeydown差別

tags：    時間：2013-12-10 00:54:27
概念onkeypress、onkeyup、onkeydown區別：
   onkeypress 這個事件在用戶按下並放開任何字母數字鍵時發生。系統按鈕（例如，箭頭鍵和功能鍵）無法得到識別。  onkeyup 這個事件在用戶放開任何先前按下的鍵盤鍵時發生。 onkeydown 這個事件在用戶按下任何鍵盤鍵（包括系統按鈕，如箭頭鍵和功能鍵）時發生。  小demo：只在在輸入的時候可以用backspace，其他地方不可以用。  <script type="text/javascript">   //處理鍵盤事件   function doKey(e){       var ev = e || window.event;//獲取event對象       var obj = ev.target || ev.srcElement;//獲取事件源       var t = obj.type || obj.getAttribute('type');//獲取事件源類型       if(ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea"){           return false;       }   }   //禁止後退鍵 作用於Firefox、Opera   document.onkeypress=doKey;   //禁止後退鍵  作用於IE、Chrome   document.onkeydown=doKey;   </script>   解決onkeydown在IE和FF中的兼容問題  （這個我沒做過測試呢） IE瀏覽器中：   var keycode = event.keyCode; FireFox和Opera瀏覽器中：   var keycode = e.which; 總結簡便寫法如下：   var currKey=0,e=e||event; currKey=e.keyCode||e.which||e.charCode;//支持IE、FF 完整demo如下：   <button type="button" onclick="searchAuction();" id="btn_selector"> 　　 <label>精確篩選</label> </button>   <script type="text/javascript"> function keydown(e) { var currKey=0,e=e||event;  currKey=e.keyCode||e.which||e.charCode;//支持IE、FF  if (currKey == 13) { document.getElementByIdx_x("btn_selector").click();  } }  document.onkeydown = keydown;//onkeydown事件調用方式 </script> 寫法一、觸發submit事件，支持IE   <form onkeydown="checkkey(event)">  //上一段中介紹的event所攜帶的值傳給了keys function checkkey(keys)   {  //判斷一下是否同時按了CTRL鍵和ENTER鍵. if(keys.ctrlKey && keys.keyCode == 13) //如果判斷的結果確實是兩個鍵準確無誤的按下了，那麼就提交數據 { this.document.form.submit(); }  } 說明：event是將這次按鍵的值傳遞給函數作判斷用的。也就是說event裡面承載著我們這次按鍵的數據。   寫法二、觸發click事件,支持IE   <body  onkeydown="if (event.keyCode==13) {document.all.button2.click();}">  寫法三、按鍵翻頁效果，支持IE  <script type="text/javascript">  var preview_page = "14671.html";  var next_page = "14675.html";  var index_page = "index.html";  var article_id = "305";  var chapter_id = "14674";  function jumpPage() {      if (event.keyCode==37)          location=preview_page;      if (event.keyCode==39)          location=next_page;      if (event.keyCode==13)          location=index_page;  }  document.onkeydown=jumpPage;  </script>    應用的demo：  在test.jsp中引入test.js  document.okeydown = KeyLogin;  function KeyLogin(){  if(event.keyCode == 13){  LoginSystem();/////觸發此function  }  }

推薦閱讀文章

Bookmark the permalink ，來源：互聯網