javascript capture browser shortcuts (ctrl+t/n/w)

by

Capturing Ctrl keyboard events in Javascript

Sample code:

$(window).keydown(function(event) {
  if(event.ctrlKey && event.keyCode == 84) { 
    console.log("Hey! Ctrl+T event captured!");
    event.preventDefault(); 
  }
  if(event.ctrlKey && event.keyCode == 83) { 
    console.log("Hey! Ctrl+S event captured!");
    event.preventDefault(); 
  }
});

Firefox

(6.0.1 tested)

In Firefox both event listener works. If you press CtrlT or CtrlS keycombinations, you will get both message on the console, and the browser wont open a tab, nor ask for save.

It is intresting that if you use alert instead of console.log the event.preventDefault() not works, and opens a new tab or asks for save. Maybe this bug needs to get fixed.

Chrome3

In Chrome 3 it works like in Firefox.

Chrome4

(tested)

In Chrome4, certain control key combinations have been reserved for browser
usage only and can no longer be intercepted by the client side JavaScript
in the web page.
These restrictions did not exist in Chrome3 and are inconsistent with both
Firefox3/3.5 and IE7/8 (on Windows).

In Chrome 4 it works similary to Firefox, except some keyboard combination:

  • CtrlN

  • CtrlShiftN

  • CtrlT

  • CtrlShiftT

  • CtrlW

  • CtrlShiftW

These combinations cannot get captured by Javascript, but embed plugins can capture these. For example if you focus in a Youtube video and press CtrlT, the browser won’t open a new tab.

IE7/8

It works like in Firefox or Chrome3.

IE9

(tested)

IE9 is a black sheep again, because it dosen’t allow javascript to capture any Ctrl? keyboard event. I tested with many keyboard combination (R,T,P,S,N,T) and neither worked. Also embed applications can’t capture the event. Tested with Youtube videos.

Thanks to @Lime for the great link.

More Related Contents:

  1. Click event doesn’t work on dynamically generated elements [duplicate]
  2. jQuery find events handlers registered with an object
  3. How to capture the browser window close event?
  4. Check if Internet Connection Exists with jQuery? [duplicate]
  5. How can I trigger the same function from multiple events with jQuery?
  6. jQuery ‘input’ event
  7. How can I recognize touch events using jQuery in Safari for iPad? Is it possible?
  8. jQuery – Trigger event when an element is removed from the DOM
  9. Custom events in jQuery?
  10. How to have click event ONLY fire on parent DIV, not children?
  11. How do I hide an element on a click event anywhere outside of the element?
  12. Adding event listeners to dynamically added elements using jQuery [duplicate]
  13. jQuery select change event get selected option
  14. Is jQuery $.browser Deprecated?
  15. Delay jquery hover event?
  16. How to detect input type=file “change” for the same file?
  17. How can I check if a key is pressed during the click event with jQuery?
  18. How do I detect a page refresh using jquery?
  19. Accessing functions bound to event handlers with jQuery
  20. Trigger change() event when setting ‘s value with val() function
  21. Events not registering after replaceWith
  22. jquery fullcalendar event filtering
  23. How do I explicitly execute default action from jQuery event
  24. jquery Event.stopPropagation() seems not to work
  25. how to unbind all event using jquery
  26. triggerHandler vs. trigger in jQuery
  27. in Jquery how to run code with callback before submit
  28. How to capture browser close event?
  29. What happens when no response is received for a request? I’m seeing retries
  30. Jquery .on(‘scroll’) not firing the event while scrolling

Leave a Comment