Javascript 在keydown事件中处理某些键时,遵从默认行为

Javascript 在keydown事件中处理某些键时,遵从默认行为,javascript,jquery,events,Javascript,Jquery,Events,我正在使用jQuery处理html树上的keydown事件。正如您从代码中看到的,我正在处理tab键,以便它遍历树。但是如果它到达树的末尾,我希望它从树中跳出并进入下一个可用字段。在这种情况下,我尝试返回true,但这不起作用 这也会阻止其他键正常工作。例如,我也想让CTRL+R工作,但当我专注于树时,它什么也不做 我将在调用e.stopPropagation()和e.preventDefault()之前返回,因此我希望默认浏览器处理程序拾取我的事件,但它们没有。我在其他帖子中读到,没有办法强制

我正在使用jQuery处理html树上的keydown事件。正如您从代码中看到的,我正在处理tab键,以便它遍历树。但是如果它到达树的末尾,我希望它从树中跳出并进入下一个可用字段。在这种情况下,我尝试返回true,但这不起作用

这也会阻止其他键正常工作。例如,我也想让CTRL+R工作,但当我专注于树时,它什么也不做

我将在调用
e.stopPropagation()
e.preventDefault()
之前返回,因此我希望默认浏览器处理程序拾取我的事件,但它们没有。我在其他帖子中读到,没有办法强制默认行为,因此我认为我最好的办法就是停止处理事件并将其传递,但它没有被传递。有人知道为什么吗

$(treeItem).keydown(function(e) {
  return onKeyDown(obj, e);
});

var onKeyDown = function(obj, e) {
  if (!obj.isRoot) {
    switch (e.keyCode) {
      case keyCode.LEFT: collapseNode(obj); break;
      case keyCode.RIGHT: expandNode(obj); break;
      case keyCode.UP: stepUpTree(obj); break;
      case keyCode.DOWN: stepDownTree(obj); break;
      case keyCode.TAB: if (e.shiftKey) stepUpTree(obj); else stepDownTree(obj); break;
      case keyCode.ENTER: me.activateNode(obj); break;
      default: return true;
    }
  }

  e.stopPropagation();
  e.preventDefault();
}
编辑


我已经更新了代码,以更准确地反映正在发生的事情。现在问题更清楚了。该事件附加到一个列表项元素,因此当我返回true时,它会一直激发所有祖先,直到它到达根。此时,默认行为停止。解决方案是仅在我知道需要时才阻止默认行为,而不是将其作为默认行为。

您不必返回
true
来告诉浏览器继续处理事件;如果您不执行
preventDefault
returnfalse
,它就会这样做。只需在
default
子句中返回
。(我希望
返回true;
是无害的,但嘿,你永远不知道。)

您引用的代码中有几个bug。我假设您使用了复制和粘贴(为什么要重新键入?),因此我想知道您遇到的问题是否只是抛出了错误,或者逻辑没有达到您预期的效果

特别是

  • onKeyDown
    函数定义的参数部分中,缺少
    obj
    e
    之间的逗号,因此这是一个语法错误
  • 您正在关闭
    e.keycode
    。它应该是
    e.keyCode
    (注意大写字母
    C
    )。如果上面缺少的逗号实际上不在代码中,但这是,
    e.keycode
    将始终是
    未定义的
    ,并且与您的任何情况都不匹配,因此所有内容都将转到
    默认值

    • 对于遇到类似问题的任何其他人

      您可能希望明确说明哪些情况应该防止默认行为,而不是将其作为默认情况

      在我的例子中,事件被绑定到一个列表项元素,这意味着如果允许传播,它将一直激发到树上。我的
      switch
      语句中没有列出的键代码只会返回true并向树上传播,直到它到达根。然后它将跳过
      switch
      语句,并调用
      preventDefault()

      换句话说

           var onTreeItemKeyDown = function (obj, event) {
               if (obj.id() !== me.treeDataManager.getRootItemId()) {
                   switch (event.keyCode) {
                       case keyCode.LEFT: collapseNode(obj, event); break;
                       case keyCode.RIGHT: expandNode(obj, event); break;
                       case keyCode.UP: getPreviousItem(obj); haltEvent(event); break;
                       case keyCode.DOWN: getNextItem(obj); haltEvent(event); break;
                       case keyCode.ENTER: if (options.activateContent) { options.activateContent(obj); haltEvent(event); } break;
                       default: return true;
                   }
               }
      
               return true;
           }
      
           var haltEvent = function (event) {
               event.stopPropagation();
               event.preventDefault();
           }
      
           var expandNode = function (obj, event) {
               obj.isExpanded(true);
               options.selectNode(obj);
               haltEvent(event);
           }
      
           var collapseNode = function (obj, event) {
               obj.isExpanded(false);
               options.selectNode(obj);
               haltEvent(event);
           }
      

      我复制并粘贴了大部分内容,但也编辑了一些内容,这就是产生错误的原因。所有这些东西都很好用。但是我的
      switch
      语句中没有列出的任何键或键组合都不起作用。