除了输入和textarea之外,在jQuery中绑定箭头键

Question

我发现这个关于使用jQuery 绑定箭头键的优秀问题:JS/jQuery中的绑定箭头键与Sygmoral的一个很好的解决方案:

$(document).keydown(function(e) {
    switch(e.which) {
        case 37: // left
        break;

        case 38: // up
        break;

        case 39: // right
        break;

        case 40: // down
        break;

        default: return; // exit this handler for other keys
    }
    e.preventDefault(); // prevent the default action (scroll / move caret)
});

除了:这可以防止箭头键以焦点位于文本输入字段中时通常的方式工作.

当当前焦点位于输入,文本区域或其他内容可编辑区域时,如何修改此解决方案以允许箭头键正常工作？

Answer 1

把它放在一个条件:

$(document).keydown(function(e) {
    if(!$(e.target).is(':input, [contenteditable]')){
        switch(e.which){
           // the cases as is
        }
        e.preventDefault(); // prevent the default action (scroll / move caret)
    }
});