通过keydown,keyup,keypress事件监听输入框内内容的问题

时间:2025-04-03 14:22:52

html

<input type="text" name="search" id="search" placeholder="请输入搜索内容">

javascript控制台输出文本框内容

var search = ("search");
 = function(){
    ()
}
 = function(){
    ()
}
 = function(){
    ()
}

当输入a时,keyup事件 输出 a,keypress 和 keydown事件输出 空字符;
当输入ab时,onkeyup事件 输出 ab,onkeypress 和 onkeydown事件输出 a;
以此类推。

总结:事件顺序:按下键盘-触发keypress和keydown-字符输入-松开键盘-触发keyup
所以keypress和keydown监听内容无法及时反馈最近一次变化。

延伸,监听内容变化一般用oninput和onchange。参考链接