箭头键在表单上不起作用答案

【问题标题】：Arrow Keys Not Working on Form箭头键在表单上不起作用
【发布时间】：2016-12-25 05:13:02
【问题描述】：

我们在特定网站上使用 Ninja Forms，每当我们在其上键入内容时，箭头键都不起作用。我进行了一项研究，发现向这个社区 (here) 展示了类似的东西。

所以我确实检查了该站点的 JS 文件并找到了所提到的内容。我注意到这组代码我认为负责禁用箭头键：

    // disable/enable scroll (mousewheel and keys) from https://stackoverflow.com/a/4770179                  
    // left: 37, up: 38, right: 39, down: 40,
    // spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36
    var keys = [37, 38, 39, 40], wheelIter = 0;

    function preventDefault(e) {
        e = e || window.event;
        if (e.preventDefault)
        e.preventDefault();
        e.returnValue = false;  
    }

    function keydown(e) {
        for (var i = keys.length; i--;) {
            if (e.keyCode === keys[i]) {
                preventDefault(e);
                return;
            }
        }
    }

但我不确定下一步该做什么，因为我最初提到的那个资源没有说明分步过程。我应该删除整组代码吗？我绝对可以做一个测试，但我想我可能会认为它有效，而实际上还有一些我可能没有注意到的其他变化。

感谢社区的指导。谢谢。

我可能应该提供一个指向实际表单的链接。 Here you go.

【问题讨论】：

为什么你的代码会永久禁用箭头键滚动？这真的很糟糕

标签： javascript jquery forms arrow-keys

【解决方案1】：

您可以使用 jQuery 检查目标是否是表单元素（因为您正在使用它），如果是，则不要调用阻止默认行为的讨厌代码。

function keydown(e) {
    // Don't block arrow keys on form elements
    if( $(e.target).is(':input') ) {
        return;
    }
    for (var i = keys.length; i--;) {
        if (e.keyCode === keys[i]) {
            preventDefault(e);
            return;
        }
    }
}

【讨论】：