js中onkeydown事件，兼容IE…

最新推荐文章于 2024-09-15 17:50:11 发布

dreamboycx

最新推荐文章于 2024-09-15 17:50:11 发布

阅读量1.9k

点赞数

分类专栏：前端设计

前端设计专栏收录该内容

121 篇文章 1 订阅

订阅专栏

原文地址：js中onkeydown事件，兼容IE和FF 作者：老怪

概念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  οnkeydοwn="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.ο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>