Sep 18

event.keyCode - 写出兼容IE和Firefox的按键捕捉及识别代码 不指定

felix021 @ 2008-9-18 19:15 [IT » 网络] 评论(3) , 引用(0) , 阅读(15581) | Via 本站原创 | |
在写Felix的javascript运行环境的时候
为了方便使用,Felix希望能够捕捉到CTRL+Enter按键作为运行的快捷键
以前写过for IE的代码,非常简单:
<script language="javascript">
function myKeyPress(){
  alert(event.keyCode);
}
</script>
<body onkeypress="myKeyPress()">
......

但是这样的代码在Firefox下根本不能运行,因为event不是Firefox的一个全局对象。
查了好多资料,终于明白了在Firefox下要这样写代码才行:
<script language="javascript">
function myKeyPress(evt){
  alert(evt.which);
}
</script>
<body onkeypress="myKeyPress(evt)">
......

但是很遗憾,这样的代码在IE下又不能运行——好吧,采取折衷方案如下:
<script language="javascript">
function myKeyPress(evt){
    evt = (evt) ? evt : ((window.event) ? window.event : "") //兼容IE和Firefox获得keyBoardEvent对象
    var key = evt.keyCode?evt.keyCode:evt.which; //兼容IE和Firefox获得keyBoardEvent对象的键值
    if(evt.ctrlKey && (key == 13 || key == 10)){ //同时按下了Ctrl和回车键
        //do something;
    }
}
</script>
<body onkeypress="myKeyPress(evt)">
......

于是代码终于可以在IE和Firefox运行了。

总结一下需要注意的地方:
1. 取得keyBoardEvent对象
2. 取得keyBoardEvent对象的键值
3. onkeypress="myKeyPress(event)" 函数需要一个参数

以上很大一部分是参考了来自以下网页:
Javascript Madness
该网页详细介绍了几个很容易令人发疯的兼容性问题。。。。



欢迎扫码关注:




转载请注明出自 ,如是转载文则注明原出处,谢谢:)
RSS订阅地址: https://www.felix021.com/blog/feed.php
yunnysunny
2009-8-7 22:46
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title> new document </title>
  <meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
  <meta name="generator" content="editplus" />
  <meta name="author" content="" />
  <meta name="keywords" content="" />
  <meta name="description" content="" />
  <script language="javascript">
  function myKeyPress(evt){
    evt = (evt) ? evt : ((window.event) ? window.event : "") //兼容IE和Firefox获得keyBoardEvent对象
    var key = evt.keyCode?evt.keyCode:evt.which; //兼容IE和Firefox获得keyBoardEvent对象的键值
    if(evt.ctrlKey && (key == 13 || key == 10)){
      alert("send");//同时按下了Ctrl和回车键
      
    }
  }
</script>
</head>


<body onkeypress="myKeyPress(event)">
</body>
</html>
ss
2009-5-21 14:45
很感谢,正在找这方面的资料
felix021 回复于 2009-5-21 16:00
cool
Eson Email
2008-10-10 17:38
不知道为什么,我测试的时候在firefox中也可以用evt.keyCode
如果我用onkeypress="if(window.event.keyCode==13){//submit();}"在firefox中不可以用;
但是如果我把代码单独写在script标签中就可以同时在ie和firefox中运行,代码如下:
在页面上:
<input type='text' id='test' onkeypress='testsubmit(event)'>
在script标签对中:
<script type='text/javascript'>
  function testsubmit(evt)
  {
       if(evt.keyCode==13)
        {
            document.forms[0].submit();
         }
  }
</script>
什么原因呢,任然没有找到答案,如果你知道答案请告诉我一声,或者哪位路人看到了并知道答案者,请告诉我,谢谢;
QQ:402530773,或者发到邮箱:eson_2@yahoo.com.cn
分页: 1/1 第一页 1 最后页
发表评论
表情
emotemotemotemotemot
emotemotemotemotemot
emotemotemotemotemot
emotemotemotemotemot
emotemotemotemotemot
打开HTML
打开UBB
打开表情
隐藏
记住我
昵称   密码   *非必须
网址   电邮   [注册]