jQuery

Question

我正在使用箭头键（和 A、W、D）在页面之间导航。

如何禁用文本区域和输入字段的按键功能？

 $(文档).keydown(函数(e) {
    开关（e.which）{
        案例 65：
            左箭头按下（）；
            休息;
        案例 37：
            左箭头按下（）；
            休息;
        案例 68：
            rightArrowPressed();
            休息;
        案例 39：
            rightArrowPressed();
            休息;
        案例 72：
            homePressed();
            休息;
        案例87：
            homePressed();
            休息;
    }
});

Answer 1

$(document).keydown(function (e) {
            var element = e.target.nodeName.toLowerCase();
            if ((element != 'input' && element != 'textarea') || $(e.target).attr("readonly") || (e.target.getAttribute("type") ==="checkbox")) {
                if (e.keyCode === 8) {
                    return false;
                }
            }

});

Answer 2

您可以使用这个（需要 Internet Explorer 9+）：

function leftArrowPressed() { console.log('left pressed'); }
function rightArrowPressed() { console.log('right pressed'); }
function homePressed() { console.log('home pressed'); }

$(document).keydown(function(e) {
    var el = document.activeElement;
    try {
        if (el && el.selectionStart !== undefined || el.isContentEditable) {
            console.log('skip');
            return; // active element has caret, do not proceed
        }
    } catch (ex) {}
    var f = {
        65: leftArrowPressed,
        37: leftArrowPressed,
        68: rightArrowPressed,
        39: rightArrowPressed,
        72: homePressed,
        87: homePressed
    };
    if (f[e.which]) f[e.which]();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input value="test">
<input type="checkbox">
<textarea>test
</textarea>
<div contenteditable>test</div>

Answer 3

因为您正在使用 jQuery:

$("input, textarea").on("keydown keyup",function(e){e.stopPropagation();});

...就是您所需要的 （片段中的其余代码并不重要，仅用于概念验证）

$("input, textarea").on("keydown keyup",function(e){e.stopPropagation();});
$(document).keydown(function(e){console.log("key pressed: "+e.which);});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" value="Test input" />&nbsp;<textarea style="height:18px;">Test textarea</textarea>&nbsp;<div style="display:inline; border: 1px solid black;">Test div</div>
<div>1. Just click somewhere in the results area and start typing. Watch the console.<br />2. Then click inside the input/textarea and do the same. Nothing will happen.</div>

jQuery - 在输入和文本区域禁用按键

jQuery - Disable keydown in input and textareas

javascript

keydown