天天看點

js中onkeydown事件,相容IE…

作者:老怪

概念onkeypress、onkeyup、onkeydown差別:

onkeypress

這個事件在使用者按下并放開任何字母數字鍵時發生。系統按鈕(例如,箭頭鍵和功能鍵)無法得到識别。

onkeyup

這個事件在使用者放開任何先前按下的鍵盤鍵時發生。

onkeydown

這個事件在使用者按下任何鍵盤鍵(包括系統按鈕,如箭頭鍵和功能鍵)時發生。

解決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" οnclick="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 οnkeydοwn="checkkey(event)">
function checkkey(keys) //上一段中介紹的event所攜帶的值傳給了keys
{
 if(keys.ctrlKey && keys.keyCode == 13){//判斷一下是否同時按了CTRL鍵和ENTER鍵.
 this.document.form.submit();
 } //如果判斷的結果确實是兩個鍵準确無誤的按下了,那麼就送出資料
}      

說明:event是将這次按鍵的值傳遞給函數作判斷用的。也就是說event裡面承載着我們這次按鍵的資料。

寫法二、觸發click事件,支援IE

<body      

寫法三、按鍵翻頁效果,支援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.οnkeydοwn=jumpPage;
</script>
<script>
//qidian
prevpage='1006900,20124741.aspx';
nextpage='1006900,20124757.aspx';
bookpage='/Book/1006900.aspx'
var prevpage;
var nextpage;
var bookpage;
function pageEvent(event)
{
event = event ? event : (window.event ? window.event :
null);
if (event.keyCode==13)
{
location=bookpage
return false;
}
if (event.keyCode==37) location=prevpage
if (event.keyCode==39) location=nextpage
}
document.οnkeydοwn=pageEvent;
-->
</script>      

繼續閱讀