0

我有这个脚本，当按下键盘上的“N”和“P”键时，它会触发滚动到下一个/上一个。我的问题是，当用户以任何形式（例如搜索字段、登录字段等）正常键入这些字母时，如何阻止它触发。因为当我在表单中按 n 例如 John 时，它不会写 N 而不是它触发滚动功能。如何解决这种行为？

我的代码如下：

$(document).keydown(function (evt) {
    if (evt.keyCode == 78) {
        evt.preventDefault();
        scrollToNew();
    } else if (evt.keyCode == 80) {
        evt.preventDefault();
        scrollToLast();
    }
});

谢谢你。

4

3 回答 3

8

事件对象有一个target属性，它告诉您事件实际发生的位置（之后它会冒泡到您的文档级处理程序）。因此，您可以evt.target针对表单字段元素进行测试，如果匹配，请不要执行您的特殊逻辑。

可能最简单的方法是使用closest，例如：

$(document).keydown(function (evt) {
    if (!$(evt.target).closest('input, select, textarea')[0]) {
        if (evt.keyCode == 78) {
            evt.preventDefault();
            scrollToNew();
        } else if (evt.keyCode == 80) {
            evt.preventDefault();
            scrollToLast();
        }
    }
});

在那里我问最接近的表单字段是从元素开始（因为closest从你给它的元素开始）并通过祖先进行处理。如果没有，则返回的 jQuery 对象将为空，并[0]返回undefined. 因此，既然!undefined是true，我们将在不在表单字段中时处理您的逻辑。

于 2012-05-25T13:24:20.753 回答
0

我想像

$('form').on('keydown', function(event) {event.stopPropagation();});

如果您不需要来自表单内部的键盘控件，应该可以解决问题。

于 2012-05-25T13:27:09.613 回答
0

使用objecttarget的属性，它指向源 DOM 节点。因此，您可以轻松使用Event

var nn = evt.target.nodeName.toLowerCase();
if (nn != "input" && nn != "textarea")
    // do your special handling

但检查form属性的存在可能更容易，它指向元素所有者形式：

if (! "form" in evt.target)
    // do your special handling
于 2012-05-25T13:35:00.390 回答