更改 JavaScript 中某些键的按键事件答案

【问题标题】：Altering the keypress event of certain keys in JavaScript更改 JavaScript 中某些键的按键事件
【发布时间】：2016-09-26 01:18:04
【问题描述】：

我正在开发一个项目，该项目显示在文本框中按下的每个键的字符代码。

我的问题是当某些键，即：Shift，Backspace，Space被按下时，它们的字符代码显示为：16、8、32。

我希望这些键在按下时保持正常行为。这样空格会导致文本框中出现空格，退格会删除字符，依此类推……但其余键继续输出其字符代码。

我怎样才能做到这一点？

【问题讨论】：

标签： javascript events keypress keyboard-events

【解决方案1】：

您可以只检查密钥并进行相应处理。这是一个演示：

document.getElementById("test-textbox").addEventListener("keypress", function(event) {
    var code = event.keyCode || event.which;
  
    if(code === 16 || code === 8 || code === 32) //check if space, shift, or backspace
        return; //if yes, allow
    
    console.log(code); //if not, log value  
    event.preventDefault(); //prevent entry
});

&lt;input type="text" id="test-textbox"&gt;

这将允许按下 shift、backspace 和 space 键，但将记录所有其他键。

【讨论】：

@mattHunting10 没问题，很高兴为您提供帮助。如果它确实帮助您考虑投票并可能接受:)
我唯一的另一个问题。是如何让SHIFT键输出大写字母。例如，如果有人按“shit + h”输出 73 而不是 72。
您可能想使用正则表达式来允许大写字母@mattHunting10，我现在时间有点短，抱歉！
@mattHunting10 有一点时间，here's 一个演示。
例如，当您按住 Shift + h 时，它会在文本框中输出 H。我正在寻找的是它在控制台中输出“H”的keyCode而不是“h”。不过还是谢谢你，你已经帮了大忙了。

【解决方案2】：

我认为这对你有用。

var elementID = document.getElementById('elementID');

elementID.onkeydown = function(event) {
    var key = event.keyCode || event.charCode;

    if( key == 32 || key == 8 )
        event.preventDefault();
};

【讨论】：

我正在尝试输出除少数几个键之外的所有键的字符代码。所以我已经必须包含 preventDefault() 以避免输出字符代码和 65a 之类的字母，而不是 65。所以这就是你的示例不起作用的原因。

【解决方案3】：

只要你……

不要在事件对象上调用preventDefault方法，并且
不要从事件处理程序返回 false

……你应该没事的。

尤其是处理程序……

function showCharCode(event) {
  // NOTE: Don’t call `event.preventDefault()` here.
  document.querySelector('.char-code').textContent = event.charCode;
  // NOTE: Don't return false here.
}

... 仍会将事件传播到默认文本框（或输入，或 contenteditable）元素。

【讨论】：

但是如果我不调用 preventDefault 方法。然后我会得到他们的键码以及与之关联的字符。比如65a。而不是 65。
@mattHunting10 所以你希望字符的键码出现在文本框中而不是实际输入，除了空格、退格和换档键？
是的，感谢您的回复。但是上面的人已经得到了解决方案。