在Chrome的Ominbox上按下Enter键时会激活Keyup事件侦听器

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

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

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

编辑:

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

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

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

但它不起作用。 如何防止它被触发?

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

  

演示。

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

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

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

Chrome的解决方案很简单:使用keypress而不是keyup 。 这并不适用于所有情况(IE),因此您可能必须添加条件才能根据浏览器切换类型。 但是,这将解决您的问题。

请注意,查找特定的密钥代码可能会使您的问题无效。 祝好运。

因为在键盘上释放任何键时会发生键盘,这就是触发事件的原因。 当文档没有焦点时,Chrome只会在使用代码段时触发此事件。

您可以过滤键码…如果有帮助… 13输入键

 $(document).on('keyup', function(event){ if( parseInt(event.keyCode,10) !== 13 ){ alert("Hey"); } });​ 

一种可能的解决方案是略微延迟“keyup”事件处理程序注册。 这将跳过Chrome和Safari中似乎发生的第一个“虚假”触发器。

 $(function() { setTimeout( function() { console.log("Delayed event attachment"); $(document).bind('keyup', log); }, 10); }); function log(e) { console.log(e.target.localName); }