Trying to handle unload event

Question

I'm trying to make some actions when I close the browser or I go to some other page but nothing its done this is the script at the bottom there are the rwho ways I tried. I tried using jquery what I realize that unload function is deprecated

if(game_id){
    get_players();
    get_users();
}

function get_players(){
    socket.emit('on_lobby', {
        game_id:game_id,
    });
    socket.on('lobby_connected',function(){
        $.ajax({
            url:'/getPlayers',
            method:'GET',
            data:{
                game_id: game_id
            }
        }).done(function(response){
            if(response.status === 'ok'){
                $('#connected_players').empty();
                $('#connected_players').append(response.html);
                
            }else{
                Swal.fire({
                    icon: 'error',
                    text: response.message,
                })
            }
        });
    });
}

function get_users(searched){
    $.ajax({
        url:'/getConnectedUsers',
        method:'GET',
        data:{
            searched:searched
        }
    }).done(function(response){
        if(response.status === 'ok'){
            $('#connected_users').empty();
            $('#connected_users').append(response.html);
            
        }else{
            Swal.fire({
                icon: 'error',
                text: response.message,
            })
        }
    });
}

function search_users(){
    var searched = $('#search-user-input').val();
    get_users(searched);
}

function send_invitation(receiver){
    socket.emit('private',{
        type:'invitation',
        receiver: receiver,
        sender: username,
        text:'/game/' + game_id
    });
}
socket.on('user_loged', function(){
    get_users();
})
socket.on('user_loged_out', function(msg){
    if($('#player-item-'+ msg.username ) !== undefined){
        $('#player-item-'+ msg.username).remove();
    }
    get_users();
})

//not work
window.onunload = unloadPage;

function unloadPage()
{
 alert("unload event detected!");
}
//doesn't works too
window.addEventListener('unload', function(event) {
    alert('I am the 3rd one.');
});

Consider the beforeunload event

Patrick
– Patrick

2020-11-15 18:18:37 +00:00
Commented Nov 15, 2020 at 18:18 — Patrick
– Patrick, Commented Nov 15, 2020 at 18:18

HoldOffHunger · Accepted Answer · 2020-11-15 18:29:19Z

2

Use the beforeunload event handler. To cite MDN Web Docs...

The beforeunload event is fired when the window, the document and its resources are about to be unloaded. The document is still visible and the event is still cancelable at this point.

You are right, unload() in jQuery is deprecated! They don't quite say it, but they do list beforeunload as a possible alternative on the unload() docs page...

In practical usage, [unload()] behavior should be tested on all supported browsers and contrasted with the similar beforeunload event.

In a simple example below, a handler checks if the user is okay with redirecting or refreshing, and if so, allows the event to handle normally (close the window), otherwise, we cancel the event (either returning false or cancelling default should be sufficient, but I like doing both).

In pure JavaScript...

window.onbeforeunload = function (e) {
    if(confirm()) {
        return true;
    }
    e.preventDefault();
    return false;
};

edited Nov 15, 2020 at 18:29

answered Nov 15, 2020 at 18:18

HoldOffHunger

21.3k11 gold badges123 silver badges147 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

af_159623 Over a year ago

using beforeunload I get an alert but not with the text setted on confirm, the browser show his own text

HoldOffHunger Over a year ago

@af_159623: Ah, interesting! I'll update my answer. It doesn't seem like you can set it anymore: Is it possible to display a custom message in the beforeunload popup? Top answer: *"tl;dr - You can't set custom message anymore in most modern browsers".

HoldOffHunger Over a year ago

@af_159623: Oops, I forgot you asked for the answer in JavaScript, and I gave jQuery. I have updated my answer!

Collectives™ on Stack Overflow

Trying to handle unload event

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related