在Chrome的Ominbox上按下Enter键时,键盘事件监听器将触发

Question

在Chrome浏览器中,使用此代码段时:

  $(document).on('keyup', function(){
    alert("Hey");
  });

每当我按下enterurl栏时(例如,当我剪切并粘贴页面本身的url时),事件监听器就会触发.为什么会这样？

编辑:

它让我感到惊讶,因为url bar不在document(可能在window？)并且firefox没有这种行为.当我查找时e.target,Chrome Inspector会显示body.

我认为这可能是由事件冒泡引起的所以我试过这个:

  $(document).on('keyup', function(e){
    e.stopPropagation();
    alert("Hey");
  });

但它不起作用.如何防止它被触发？

Answer 1

发生这种情况是因为一旦你在多功能框中输入,焦点就会转向页面.如果你尝试过相同的东西onkeydown,多功能框就不会改变,因为正如你所说,它不是文档的一部分.过滤多功能框的错误事件的一种方法是检查每个keyup都有一对keydown.

<script>
var down = false;
document.addEventListener('keydown', function (){
    down = true;
}, false);

document.addEventListener('keyup', function (){
    if(down === true){
        alert('It was from the page!');
    }
    else{
        alert('Omnibox. Ignore it.');
    }
    down = false;
}, false);

</script>

演示.

制作自己的HTML页面并优先尝试,因为PasteHTML.com将其填充到iframe中.要使其在此处正常工作,请先单击文本以获得iframe焦点.

演示. 请记住使用鼠标将焦点放在多功能框上并键入,而不是键盘快捷键.(这会引发onkeydown事件,造成误报)

更新:从Chrome 35开始,这种情况不再发生了.但是,我不知道他们修复了哪个版本.