浏览器兼容性---普通的Javascript代码

问题描述：

我很努力地在Chrome浏览器版本43.0.2357.81 m以下的代码中运行，以及OS Windows XP。浏览器兼容性---普通的Javascript代码

下面的代码是完美的Firefox和IE。是Chrome浏览器与Windows XP兼容与否。

在铬我得到TrpeError：翻译不是功能;

在此先感谢。

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript"> 
      function translate(event){ 
       if(event.keyCode == 13 || event.which==13){     
        alert("You have entered ENTER key");      
       } 
      } 

     </script> 
    </head> 
    <body> 
     <table> 
      <tr> 
       <td>User Name: </td> 
       <td><input type="text" name="username" id="username"></td> 

      </tr>   
      <tr> 
       <td>Password :</td> 
       <td> 
        <input type="password" name="password" id="password" onkeydown="javascript: translate(event)"> 
       </td> 

      </tr> 
      <tr> 
       <td></td> 
       <td><input type="submit" name="Login" value="Login"></td> 

      </tr> 

     </table> 
    </body> 
</html>

更改函数名称，它的工作原理。 – Lain

什么是TrpeError？ –

未捕获TypeError –

答

编辑：正如Aar Digulla指出的那样，这与Chrome的内容安全策略无关，正如我第一次想到的那样。然而，我会留下这个答案，因为下面的代码仍然是处理事件的有效方法。

var passfield = document.getElementById('password'); 
passfield.onkeydown = function(event) { 
    if(event.keyCode == 13 || event.which==13){     
      alert("You have entered ENTER key");      
    } 
}

下小提琴显示这个动作：
https://jsfiddle.net/x0enzmc7/

答案的第一部分仅适用于服务器向浏览器发送特殊报头以启用CSP的情况。具体来说，如果Chrome默认启用CSP，jsfiddle将不起作用。 –

谢谢Aaron，我已经更新了我的答案以反映这一点。 – Vaune

答

略去javascript:。这应该工作：

... onkeydown="translate(event)" ...

但它可能不太脆的功能附加到页面的onload事件：

function onload() { 
    var password = document.getElementById('password'); 
    password.onkeydown = translate; 
}

注意event可能的translate()内是不确定的。使用

event = event || window.event;

来解决这个问题。

最后，函数应返回true或false，具体取决于是否要吞下该事件。

正如你所看到的，这很难找到正确的答案。只需将jQuery添加到您的页面并使用它即可修复所有这些讨厌的问题。

thanx亚伦，我是新来的JavaScript，这里我的问题是在JavaScript函数何时使用真假返回 –

阅读http://www.quirksmode.org/js/introevents.html和http://*.com /问题/ 4379403/jQuery的事件处理程序返回值 –

浏览器兼容性---普通的Javascript代码

相关推荐