如何防止使用箭头键而不是鼠标滚动？

Since I'm using jQuery, any solution via that would work too. Ideally, I'd like to know both, though.

由于我使用的是jQuery，因此任何解决方案都可以使用。理想情况下，我想知道两者。

I already have the arrow keys bound to another function on my page (using jQuery), but having them cause the page to scroll in addition to that, causes me problems.

我已经将箭头键绑定到我页面上的另一个函数（使用jQuery），但是让它们导致页面滚动除此之外，会导致我出现问题。

I may have known this at one time, but I don't remember it anymore.

我可能一次都知道这个，但我不记得了。

3 个解决方案

#1

Adding document level keypress handler does the trick!

添加文档级按键处理程序就可以了！

var ar=new Array(33,34,35,36,37,38,39,40);

$(document).keydown(function(e) {
     var key = e.which;
      //console.log(key);
      //if(key==35 || key == 36 || key == 37 || key == 39)
      if($.inArray(key,ar) > -1) {
          e.preventDefault();
          return false;
      }
      return true;
});

#2

Under some circumstances, eg. when you don't actualy have an element you focus on, just some area you had to click, you might not have too much control over the handler and preventing the event at the global level can be a little flaky at best (as I found out the hard way).

在某些情况下，例如。如果你没有实际拥有一个你关注的元素，只需要点击一些区域，你可能没有太多控制处理程序，并且防止全局级别的事件最多可能有点片状（正如我发现的那样）出困难的方式）。

The simplest solution in those cases is to bind on the click even of the control button and focus on a empty input element which you position -9000px to the left.

在这些情况下，最简单的解决方案是绑定控制按钮上的单击，并将焦点放在一个空的输入元素上，您将-9000px放在左侧。

You can then reliably block the event via keydown and also dont have to worry about blocking default behavior or other global listeners since the default behavior on the input element will just move the cursor to the left and right.

然后，您可以通过keydown可靠地阻止事件，也不必担心阻止默认行为或其他全局侦听器，因为输入元素上的默认行为只是将光标向左和向右移动。

#3

If you add a document level keypress handler it will prevent normal scroll on the page at any time, not only when your element has the focus, this might be an undesired effect.

如果您添加文档级别的按键处理程序，它将阻止页面上的正常滚动，不仅在您的元素具有焦点时，这可能是不希望的效果。

#1