根据MDN,我们绝对不应该使用. keycode属性。已弃用:
https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode
在W3学校,这个事实被淡化了,只有一个边注说。keycode只是为了兼容性而提供的,最新版本的DOM事件规范建议使用.key属性。
问题是浏览器不支持.key,那么我们应该使用什么呢?我遗漏了什么吗?
根据MDN,我们绝对不应该使用. keycode属性。已弃用:
https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode
在W3学校,这个事实被淡化了,只有一个边注说。keycode只是为了兼容性而提供的,最新版本的DOM事件规范建议使用.key属性。
问题是浏览器不支持.key,那么我们应该使用什么呢?我遗漏了什么吗?
当前回答
你可以使用
parseInt(event.key, radix: 10)
其他回答
这里建议使用key value而不是keyCode,如果失败,则使用keyCode。但是这还不够,因为这个属性中的值是不兼容的。事情是new key包含控制键的字符串,比如:ArrowUp,但keyCode只包含简单的代码
String.fromCharCode(event.keyCode)
将导致不可打印的字符。下面是可打印字符的解决方案:
element.keydown((event) => {
var symbolPressed;
//cross browser
if (event.key !== undefined) {
symbolPressed = event.key; //Here control characters represented as String like: ArrowUp
if (symbolPressed.length > 1) return; //filter out control characters
} else if (event.keyCode !== undefined) {
symbolPressed = String.fromCharCode(event.keyCode); //Here control chars represented as one char string
}
//Update this regex if you need other characters
if (!symbolPressed.match(/[A-z0-9\s]/)) return;
console.log(symbolPressed);
});
如果需要不可打印的控制字符,则必须相应地更新条件和正则表达式。
MDN已经提供了一个解决方案:
https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode
window.addEventListener("keydown", function (event) {
if (event.defaultPrevented) {
return; // Should do nothing if the default action has been cancelled
}
var handled = false;
if (event.key !== undefined) {
// Handle the event with KeyboardEvent.key and set handled true.
} else if (event.keyIdentifier !== undefined) {
// Handle the event with KeyboardEvent.keyIdentifier and set handled true.
} else if (event.keyCode !== undefined) {
// Handle the event with KeyboardEvent.keyCode and set handled true.
}
if (handled) {
// Suppress "double action" if event handled
event.preventDefault();
}
}, true);
e.charCode已弃用:
<input
onChange={(e) => setToken(e.target.value)}
type="text"
value={token}
onKeyPress={(e) => {
if (e.charCode === 13) {
verifyLoginF()
}
}}
/>
你应该用现在:e。键=== 'Enter'
你有三种方法来处理它,因为它写在你分享的链接上。
if (event.key !== undefined) {
} else if (event.keyIdentifier !== undefined) {
} else if (event.keyCode !== undefined) {
}
你应该考虑它们,如果你想要跨浏览器支持,这是正确的方法。
如果你实现这样的东西,它会更容易。
var dispatchForCode = function(event, callback) {
var code;
if (event.key !== undefined) {
code = event.key;
} else if (event.keyIdentifier !== undefined) {
code = event.keyIdentifier;
} else if (event.keyCode !== undefined) {
code = event.keyCode;
}
callback(code);
};
你可以使用
parseInt(event.key, radix: 10)