capturing f5 keypress event in javascript using window.event.keyCode in [removed] event is always 0 and not 116

Question

i am creating an MVC application.There was a neccessitity to make a variable in a session to null upon closing of the application (i.e. window/tab) but not upon refreshing t

Answer 1

Dont use e.keyCode == 166 use e.code == 'F5' instead.

 function fkey(e){
    e = e || window.event;
   if( wasPressed ) return; 

    function fkey(e){
        e = e || window.event;
        if (e.code === 'F5') {
            alert("f5 pressed");
            wasPressed = true;
        }else {
            alert("Window closed");
        }
    }

This is because the 't' and 'F5' both use the keycode number 116. If you go on keycode alone then if the user presses the 't' key your page will refresh.

Answer 2

You have to listen to different events if you want this to work crossborwser + you have to listen to the key-event every time its pressed, not on load:

document.onkeydown = fkey;
document.onkeypress = fkey
document.onkeyup = fkey;

var wasPressed = false;

function fkey(e){
        e = e || window.event;
       if( wasPressed ) return; 

        if (e.keyCode == 116) {
             alert("f5 pressed");
            wasPressed = true;
        }else {
            alert("Window closed");
        }
 }

here is a demo: http://jsfiddle.net/FSrgV/1/embedded/result/

but if you simply want to know if the user quits the page you could simply use window.onbeforeunload: https://developer.mozilla.org/en-US/docs/DOM/window.onbeforeunload

Answer 3

I agree with meo's solution, but I will add some modifications.

when we use document.onkeydown = fkey; for example and in the page we have another method affected to the document.onkeydown then the browser will detect only the last event. However when we use : jQuery(document).on("keydown",fkey); even if we have another function to handle the keydown event, all the functions will be triggered.

see the next example to more understand:

var wasPressed = false;
document.onkeydown = f1;
document.onkeydown = f2;

jQuery(document).on("keydown",f3); 
jQuery(document).on("keydown",f4); 
function f1(e){
e = e || window.event;
if( wasPressed ) return; 

        if (e.keyCode == 116) {
             alert("f5 pressed");
            wasPressed = true;
        }else {
            alert("Window closed");
        }
}
function f2(){
    alert('f2');
}
function f3(){
    alert('f3');
}
function f4(){
    alert('f4');
}

what will be shown here: only 3 alerts: f2,f3 and f4. and the f1 function isn't triggred in this example.

Answer 4

dont use (e.keyCode == 116) to ckeck F5 ; instead of use this

<script>
    document.onkeydown = capturekey;
    document.onkeypress = capturekey;
    document.onkeyup = capturekey;

    function capturekey(e) {
        e = e || window.event;
        //debugger
        if (e.code == 'F5') {
            if (confirm('do u wanna to refresh??')) {
                //allow to refresh
            } 
            else {
                //avoid from refresh
                e.preventDefault()
                e.stopPropagation()
            }
        }
    }
</script>

Answer 5

document.onkeydown = disableF5;
document.onkeypress = disableF5
document.onkeyup = disableF5;    
function disableF5(e) { if ((e.which || e.keyCode) == 116) e.preventDefault(); };

Answer 6

Modified version and working also after pressing 't'.

key 116 getting pressed auto after 84

document.onkeydown = fkey;
document.onkeypress = fkey
document.onkeyup = fkey;

var wasPressed = false;

function fkey(e){
    e = e || window.event;
   if( wasPressed ) return; 

    if (e.keyCode == 116) {
         alert("f5 pressed");

    }else {
        alert("Window closed");
    }
    wasPressed = true;
}