onekeydown在Firefox 65.0 ubuntu 18.04中为每个键盘按下返回“Process”字符串

Question

我正在使用Firefox 65.0进行Web开发。我的项目代码包含密码输入。我在一年多前开发了这个，使用JS代码，使用onkeydown和onkeyup函数检测按键。除了新的Firefox 65.0版之外，它适用于所有浏览器

我的代码与此类似：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type=password id="button" autocomplete_="off"></input>

<script>
  $("#button").keydown(function(event) {
    console.log("key: " + event.key);
  });

  document.getElementById("button").onkeydown = function(event) {
    console.log("key: " + event.key);
  };
</script>

对于这两种情况，event.key值不是按下的按钮，但它只是"Process"作为字符串。有人知道我为什么得到这个结果吗？如何解决它并检测真正按下的键值？

我的操作系统版本：是ubuntu 18.04

编辑：添加调试屏幕截图

另外我找不到可以帮助我的事件下的任何属性

您可以在下面找到onkeydown处理程序中针对'a'键情况的调试的屏幕截图。

Answer 1

关键代码有很多不同的事件属性，它们都会返回一些不同的东西。尝试event.which，如果这不起作用，here's a list of other event properties

编辑提供其他信息

我做了一些测试，原因似乎是你试图在type =“password”的输入上记录按键。我删除了type =“password”后，在Firefox中测试了你的代码片段，event.which和event.key正常工作。我想它被Firefox故意混淆，以避免脚本记录密码键击。如果需要密码值，请在事件监听器中使用event.target.value。另外我建议使用'keyup'事件而不是keydown，否则当你按住某个键时会遇到监听器反复触发的问题。

使用密码属性

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="password" id="button" autocomplete_="off"></input>

<script>  
  // Either remove the password type on your button, or access the event.target.value property and slice out the last keypress
  document.querySelector("#button").addEventListener('keyup', (event) => {
  	console.log(`Which: ${event.which}, Key: ${event.key}`);
    console.log(`Value: ${event.target.value}`);
  });
</script>

没有密码属性

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="button" autocomplete_="off"></input>

<script>  
  // Either remove the password type on your button, or access the event.target.value property and slice out the last keypress
  document.querySelector("#button").addEventListener('keyup', (event) => {
  	console.log(`Which: ${event.which}, Key: ${event.key}`);
    //console.log(`Value: ${event.target.value}`);
  });
</script>