jQuery keydown和:not与输入 [英] jQuery keydown and :not with inputs

问题描述

我正在使用一个小的脚本，当按下箭头键时，该脚本会触发页面上的下一个/上一个链接.我试图防止这种情况在用户输入搜索输入表单时发生(也许他们拼写了错误的查询，并想使用箭头键进行修复).

I am using a small script that triggers the next/previous links on the page when an arrow key is pressed. I am trying to prevent this from happening when a user is typing in my search input form (maybe they spelled their query wrong and want to use the arrow keys to fix).

这就是我正在使用的东西:

Here is what I'm working with:

var $j = jQuery.noConflict();

$j(function(){
    $j('.n').click(function() {
        location.href = $j(this).attr('href')
    });
    $j('.p').click(function(){
        location.href = $j(this).attr('href')
    });
});

$j(':not(input)').keydown(function(event) {
    if(event.keyCode==39) {
        $j('.n').trigger('click')
    }
    if(event.keyCode==37) {
        $j('.p').trigger('click')
    }
});

HTML基本上只是带有input字段的form.即使光标位于输入中，触发器仍会消失.我不确定自己在做什么错.任何帮助深表感谢！

And the HTML is basically just a form with an input field. The trigger still goes even when the cursor is in the input. I'm not sure what I'm doing wrong. Any help is much appreciated!

推荐答案

该事件正在从输入到整个文档的其余部分冒泡.

the event is bubbling up from the input through the rest of the document.

在您的事件中，尝试注销event.trigger:

In your event try logging out event.trigger :

$j(':not(input)').keydown(function(event) {
  console.log(event.trigger);
  // REST OF FN

我敢打赌这不是HTMLInputElement

一种解决方案，尝试绑定输入并停止事件传播:

One solution, try binding on inputs and stopping the event propagation :

$j('input').keydown(function(event) {
  event.stopPropagation();
});

看看是否有帮助.

这篇关于jQuery keydown和:not与输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！