Javascript onKeyPress 事件在 Firefox 中不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4496910/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 12:39:07  来源:igfitidea点击:

onKeyPress event not working in Firefox

javascriptfirefoxjavascript-eventsonkeypress

提问by Nirmal

I have the following javascript code...Here I am using onKeyPress="someFunction( )"in the body tag to get the keyCode of the key that is pressed.

我有以下 javascript 代码...这里我在 body 标签中使用onKeyPress="someFunction( )"来获取按下的键的 keyCode。

The code is working fine in IE8 but this is not working in Firefox.

该代码在 IE8 中运行良好,但在 Firefox 中不起作用。

Please give some solution to this.

请对此给出一些解决方案。

<html>
<head>
<title>onKeyPress( ) event not working in firefox..</title>
<script>
function printDiv()
{
  var divToPrint=document.getElementById('prnt');
  newWin=window.open(''+self.location,'PrintWin','left=50,top=20,width=590,height=840,toolbar=1,resizable=1,scrollbars=yes');
  newWin.document.write(divToPrint.outerHTML);
  newWin.print();
  //newWin.close();
}
</script>

<script>
function keypress()
{
  alert(event.keyCode);
  var key=event.keyCode;
  if(key==112 || key==80)
 printDiv();
  else if(key==101 || key==69)
    window.location="http://google.com";
  else if(key==114 || key==82)
    window.reset();  
}
</script>
</head>
<body bgcolor="lightblue" onkeypress="keypress()">

Thanks in advance.....

提前致谢.....



Here is the total code which is working fine in IE8 and not working in Firefox.

这是在 IE8 中运行良好但在 Firefox 中不起作用的总代码。

<!DOCTYPE html>
<html>
    <head>
    <title>Please help me out</title>
    <script type="text/javascript">
    function printDiv()
    {
      var divToPrint=document.getElementById('prnt');
      newWin=window.open(''+self.location,'PrintWin','left=50,top=20,width=590,height=840,toolbar=1,resizable=1,scrollbars=yes');
      newWin.document.write(divToPrint.outerHTML);
      newWin.print();
    }
    </script>

    <script type="text/javascript">
    function keypress(val)
    {
      //-----------------------------------------------------   
      //alert('nnnn');
      //alert(window.event ? event.keyCode : val.which);  
      //if(val.which != 0 && val.charCode != 0)
      // alert('Firefox'+String.fromCharCode(val.which));
      //else
      // alert('IE'); 
      //------------------------------------------------------- 
      var key=event.keyCode;
      if(key==112 || key==80 || val=="print")
        printDiv();
      else if(key==101 || key==69 || val=="exit")
        window.location="http://google.co.in";
      else if(key==114 || key==82 || val=="refresh")
        document.forms[0].reset();  
      else
        event.returnValue=true;
    }
    </script>
</head>
<body bgcolor="lightblue" topmargin="0" leftmargin="0"marginwidth="0px" marginheight="0px" onkeypress="keypress(null)">
<table align="left" border="1" cellpadding="5" cellspacing="0" style="width: 100%;height:100%">
<tbody>
<tr><td width="20%" valign="top">ccccccccccc</td>
    <td width="80%" align="center">
        <table style="width: 100%" border="0" valign="top">
        <tr align="right">
        <td valign="top">
        <button value="refresh" accesskey="R" onclick="keypress(this.value)">
            <b><u>R</u></b>efresh
        </button>
        <button value="print" accesskey="P" onclick="keypress(this.value)">
            &nbsp;&nbsp;<b><u>P</u></b>rint&nbsp;&nbsp;
        </button>
        <button value="exit" accesskey="E" onclick="keypress(this.value)">
            &nbsp;&nbsp;&nbsp;<b><u>E</u></b>xit&nbsp;&nbsp;&nbsp;
        </button>
        </td></tr>
        </table> 
        <h3>Press the letters P->Print , E->Exit etc....</h3>   
        <h1>Just a test for keypress event</h1>
        <form action="http://google.co.in" method="Post">
            <div id="prnt">
                zzzzzzzzzzzzzzz
            </div>
        </form>
    </td>
</tr>
</tbody>
</table></body></html>

回答by powtac

When problems like this show up, I start to use any kind of a JavaScript framework. Those frameworks are build to avoid problems with different browsers.

当出现这样的问题时,我开始使用任何类型的 JavaScript 框架。这些框架的构建是为了避免不同浏览器的问题。

To catch all different keypress()apis, like the link from Emmett shows, can be very difficult.

捕获所有不同的keypress()api,例如 Emmett 节目中的链接,可能非常困难。

Example:

例子:

In HTML head:

在 HTML 头部:

<script src="http://code.jquery.com/jquery-1.4.4.js"></script>

In the JS tag:

在 JS 标签中:

$(document).keydown(function(event) {
 alert('You pressed '+event.keyCode);
 event.preventDefault();
});

回答by Emmett

Browsers have different ways of handling keyboard events. Have a look at http://unixpapa.com/js/key.htmlfor more info.

浏览器有不同的处理键盘事件的方法。查看http://unixpapa.com/js/key.html了解更多信息。

For example, these changes to your code will get it working in Firefox:

例如,对您的代码进行的这些更改将使其在 Firefox 中工作:

<body bgcolor="lightblue" onkeypress="keypress(e)">

and

function keypress(e) {
    alert(window.event ? event.keyCode : e.which);
    // other stuff
}

回答by Kumar

Pass event object as an parameter and your code will work in IE as well as firefox. The code example is as follows :

将事件对象作为参数传递,您的代码将在 IE 和 Firefox 中工作。代码示例如下:

<body bgcolor="lightblue" onkeypress="keypress(event)">
function keypress(event) {
  alert(event.keyCode);
  var key=event.keyCode;
  if(key==112 || key==80)
      printDiv();
  else if(key==101 || key==69)
      window.location="http://google.com";
  else if(key==114 || key==82)
      window.reset();  
}

回答by Vinay

I think Firefox are not caring programmers... and this is the reason why so, In Firefox navigator.appName returns "Netscape". so user can edit his code like,

我认为 Firefox 不是关心程序员......这就是为什么如此,在 Firefox navigator.appName 中返回“Netscape”。所以用户可以编辑他的代码,比如,

if(navigator.appName == "Netscape") 
    Key = event.charCode; //or e.which; (standard method)
else 
    Key = event.keyCode;