1

当用户按下返回键时，我正在使用 keyup 事件来触发与单击搜索按钮相同的事件。单击搜索按钮时，它使用 Ajax 请求在页面上加载搜索结果。

调用工作正常，但是当我在之前关注输入框之后按下谷歌浏览器地址栏中的返回按钮时，keyup 事件被捕获，例如，如果用户在没有按返回的情况下键入搜索查询，而是去到使用 Google Chrome 地址栏的新网页，当他们在地址栏上按回车键时，我的页面中的搜索将在触发 keyup 事件的同时提交，即使页面，当然还有输入框，应该不再有焦点。

JavaScript

$("#search-box").on("keyup", function(event) {
   if(event.keyCode == 13){
       $("#search-submit-btn").click();
   }
});

HTML

<div class="input-append"/>
   <input id="search-box" type="text" />
   <button class="btn" id="search-submit-btn">Search</button>
</div>

我也在使用 Twitter 引导程序来设置输入框的样式，但我认为这不会导致问题。

我已经在 Firefox 和 Safari 中测试了这个页面，没有任何问题。Google Chrome 的 keyup 事件是否有问题/这是一个已知问题吗？我正在努力寻找有关该问题的任何信息。

编辑

我想我已经通过使用 keydown 而不是 keyup 解决了我的问题。我还添加了检查元素是否仍然聚焦，但我认为这没有什么不同，因为它仍然具有与 keyup 相同的影响。

$("#search-box").on("keydown", function(event) {
    if($("#search-box").is(":focus")){
        if(event.keyCode == 13){
            $("#search-submit-btn").click();
        }
    }
});

这对我来说似乎是一个不错的解决方案，但它并不能解释为什么 keyup 在 Google Chrome 中的行为如此奇怪。如果有人有更多关于为什么在 Google Chrome 中以这种方式使用 keyup 的信息，或者我只是做错了什么，我很想听听。

4

0 回答 0