javascript - 恢复箭头键的默认值

Question

我正在使用一个脚本（impress.js），它将一些特定的操作绑定到左、右、上、下箭头的 keyup 和 keydown 事件。

在某些特定时刻（例如在输入文本区域时），我想要返回箭头的默认行为。

我试过没有成功

$("a#show-ta").click( function() {      
  document.addEventListener("keydown", function ( event ) {
    if (event.keyCode >= 37 && event.keyCode <= 40) {
      return;
    }
  });
  document.addEventListener("keyup", function ( event ) {
    if (event.keyCode >= 37 && event.keyCode <= 40) {
      return;
    }
  }); 
}); 

a#show-ta显示我的文本区域的按钮在哪里。

Answer 1

您想防止按键冒泡到（我假设）Impress 绑定其处理程序的文档：

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

Answer 2

如果您需要特定区域中的事件，例如 texarea，您应该像这样停止事件的传播：

$('textarea').keydown( function(ev) {
    ev.stopPropagation();
});

例如，如果整个页面都需要事件，但您想在文本区域中排除这些事件，则可以提出一个标志，您将在事件中验证该标志。

var keydownActivated = true;

$('textarea').keydown( function(ev) {
    if (keydownActivated) {
        ev.preventDefault();
        // dostuff
    }
});

Answer 3

这或多或少会让你到达你要去的地方。创建一个跟踪 textarea 是否具有焦点的标志，并在当前按键事件处理程序中检查该标志。我看不到你所有的代码，所以这只是一个简单的例子：

var textareaHasFocus = false;

var textarea = document.querySelector('#yourTextarea');
textarea.addEventListener('focus', function(event) {
  textareaHasFocus = true;
}, false);

textarea.addEventListener('blur', function(event) {
  textareaHasFocus = false;
}, false);

document.addEventListener("keydown", function ( event ) {
  if (textareaHasFocus) return true;
  // your current keyboard handler
});
document.addEventListener("keyup", function ( event ) {
  if (textareaHasFocus) return true;
  // your current keyboard handler
});