Search code examples
javascripteventskeyboardscrollprototypejs

Stop page from scrolling when intercepting key presses like space and arrows

I'm using JavaScript and Prototype and catching the key presses from the user. I successfully catch return, space and arrows with code like this:

Event.observe(window, "keyup", function(e) {
  switch (e.keyCode) {
    case Event.KEY_RETURN:
    case Event.KEY_RIGHT:
    case 32:  // space
      // do something
      break;
  }
});

My problem is that spaces and arrow keep on scrolling the page. Is there a way to keep them from scrolling the page?

Solution

  • From the Prototype documentation:

    Event.stop(event)
    Stops the event’s propagation and prevents its default action from being triggered eventually.

    So adding Event.stop(e); before the break; should solve your problem.

    Also, you should be doing this for the keydown event, because keyup is too late.