I am trying to prevent page refresh only when user clicks Ctrl with R.
I try with the preventDefault() method as following but it does not work:
function disableCtrlR(s) { if ((s.which || s.keyCode) == 17 && (s.which || s.keyCode) == 82) s.preventDefault(); };
$(document).ready(function(){
$(document).on("keydown", disableCtrlR);
});
Any help on this will be appreciated. Thanks.
PS. I know this is not an ideal solution but this is the only solution for me to solve the bug on my webpage while waiting for the bug to be resolved.
I am trying to prevent page refresh only when user clicks Ctrl with R.
I try with the preventDefault() method as following but it does not work:
function disableCtrlR(s) { if ((s.which || s.keyCode) == 17 && (s.which || s.keyCode) == 82) s.preventDefault(); };
$(document).ready(function(){
$(document).on("keydown", disableCtrlR);
});
Any help on this will be appreciated. Thanks.
PS. I know this is not an ideal solution but this is the only solution for me to solve the bug on my webpage while waiting for the bug to be resolved.
Share Improve this question asked Oct 23, 2017 at 4:47 Brian CheongBrian Cheong 713 silver badges12 bronze badges 5-
That condition is guaranteed to be
false. You should try a debugger to see whether the execution is actually entering theifbody. – JLRishe Commented Oct 23, 2017 at 4:54 - @JLRishe, I tried to include alert inside the if body, and it displays the alert message when I press Ctrl or R. Any idea? – Brian Cheong Commented Oct 23, 2017 at 4:56
- 1 Just keep in mind, this is a windows-specific hack. Apple users will use the mand key, not the control key. – Patrick Roberts Commented Oct 23, 2017 at 5:33
- @PatrickRoberts, thanks for the information. – Brian Cheong Commented Oct 23, 2017 at 6:05
- Note to everyone: don't do this. It's very annoying. – Reinstate Monica -- notmaynard Commented Nov 2, 2023 at 16:05
2 Answers
Reset to default 6
<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(document).on("keydown", function(e) {
e = e || window.event;
if (e.ctrlKey) {
var c = e.which || e.keyCode;
if (c == 82) {
e.preventDefault();
e.stopPropagation();
}
}
});
});
</script>
<h1>If you click in here, you won't be able to refresh with Ctrl+R</h1>
<input type="text" />Using jQuery 2.1.1, this will disable reload by Ctrl+R
To check if there is a control key pressed simultaneously in an key event, you'll check for the KeyboardEvent.ctrlKey property.
// beware ES6 below, will fail in Netscape
onkeydown = e => {
if(e.key === 'r' && e.ctrlKey){
e.preventDefault();
console.log('ctrl + r')
}
}<input autofocus>Addendum:
As you mentioned in your question, this is very-much "not an ideal solution". Blocking default browser behavior should be made only on special cases, like here blocking the ctrl+R shortcut should only be done on some part of a web-application that really needs this shortcut, and not on the document itself. That's part of why I never talked about blocking the page refresh in this answer (which would need some extra work to work in this intent on all platforms).