I want to capture the Ctrl-R or F5 shortcut on the browser to prevent it from performing a browser refresh, but instead perform a custom refresh.
I was able to capture Ctrl-R on Safari and FF using:
document.onkeypress = function(e){
if ((e.ctrlKey || e.metaKey) && e.keyCode == 114) // Ctrl-R
e.preventDefault();
}
But that doesn't work on IE. Is there any way to do this on IE?
Update: For people who are asking why I am doing this in the first place: I just wanted to do a custom app refresh, but wanted to avoid having a "refresh" button because I kinda discourage using the refresh (We have a full page flex app). We ended up switching to F8 because F5 was just too hard to get working on all browsers.
If you are in the situation where an element of the page has not loaded, an image for example, the simplest way is to do the combination Shift + F5. Other shortcuts: Ctrl + Shift + r or Ctrl + F5. This operation is the same on most modern browsers (Chrome, Firefox, Safari, Opera, Brave, Edge, …).
unbind("keydown", disableF5); /* OR jQuery >= 1.7 */ $(document). off("keydown", disableF5); On a side note: This only disables the f5 button on the keyboard. To truly disable refresh you must use a server side script to check for page state changes.
Clear cache For A Specific Website Try 'hard-refreshing by pressing Ctrl-Shift-R (Windows) or Command-Shift-R (Mac); or Ctrl-Shift-F5 (Windows) or Command-Shift-F5 (Mac).
You can force Chrome to pull in new data and ignore the saved ("cached") data by using the keyboard shortcut Cmd+Shift+R on a Mac, and Ctrl+F5 on a PC. If that doesn't work, you can actually delete the saved files and info. This is called clearing your cache and cookies.
Open JavaScript
http://www.openjs.com/scripts/events/keyboard_shortcuts/
For certain keys (F1, F4), you have to open a new browser window without the address bar.
Example
Open a new window, without adornments:
window.open( 'webpage.html', 'TLA', 'toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=800,height=665' );
JavaScript to use the library:
var FALSE_FUNCTION = new Function( "return false" );
/**
* Called to disable F1, F3, and F5.
*/
function disableShortcuts() {
// Disable online help (the F1 key).
//
document.onhelp = FALSE_FUNCTION;
window.onhelp = FALSE_FUNCTION;
// Disable the F1, F3 and F5 keys. Without this, browsers that have these
// function keys assigned to a specific behaviour (i.e., opening a search
// tab, or refreshing the page) will continue to execute that behaviour.
//
document.onkeydown = function disableKeys() {
// Disable F1, F3 and F5 (112, 114 and 116, respectively).
//
if( typeof event != 'undefined' ) {
if( (event.keyCode == 112) ||
(event.keyCode == 114) ||
(event.keyCode == 116) ) {
event.keyCode = 0;
return false;
}
}
};
// For good measure, assign F1, F3, and F5 to functions that do nothing.
//
shortcut.add( "f1", FALSE_FUNCTION );
shortcut.add( "f3", FALSE_FUNCTION );
shortcut.add( "f5", FALSE_FUNCTION );
}
Inside webpage.html
:
<body onload="disableShortcuts();">
There's no solid way to override the function-keys in browsers.
Internet Explorer has certain keys that can't be overridden, and certain keys which - even when overridden - still executes default behavior--like the F11 key, which switches to full-screen mode, and the F1 key which opens up a help-window.
Chrome does not allow you to use key-events at all.
FireFox is the most benign, but still sketchy--like Internet Explorer; there are still some keys and default behavior you cant override.
And finally.. Opera.. Which is about as difficult as Internet Explorer.
And the default behavior is different from version to version. It's like walking into a mine-field.. Blindfolded.. :)
Trying to override CTRL+R / F5 smells like bad design.
What problem are you trying to solve?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With