提问者:小点点

为什么keyup事件对相同的输入具有不同的键属性?


我需要检测输入值何时发生变化,如果输入的最后一个字符是'@',我需要以某种方式编辑这个输入。

因此我为keyup事件添加了事件侦听器。

const inputEl = document.getElementById('input');

inputEl.addEventListener('keyup', event => {
    console.log(event.key);
})

对于输入的相同值(@),有时会记录“Shift”和“@”,有时会记录“Shift”和“2”

如果我将此侦听器添加到keypress事件,它总是记录“shift”,然后记录“@”。

但是我不能使用keypress,因为此事件在keyup之前和DOM中更新输入值之前激发。

有没有一种方法可以可靠地检测最后输入的字符?


共1个答案

匿名用户

您想知道“输入的最后一个字符是否是'@'”,因此我不会为此使用event.key,只要当您专注于输入时,它会触发您在键盘上按下的每个键。

您应该使用event.target.value并拆分最后一个字符。 像这样的东西:

null

const inputEl = document.getElementById('input');

inputEl.addEventListener('keyup', event => {
    const value = event.target.value;
    console.log(value.substr(value.length - 1)); 
})
<input id="input"/>