Allow a Function to be called only after a time that page has been loaded

Question

I wonder if there’s a way to allow a Function to be called only after a few seconds. Example I have a function that emits sound when a new message appears it is called, but when I restart the page the Function is called right from the beginning, the notification should stay more the sound should not be called, only when a message arrives there yes it should be called.

So let’s say that you received an msg and will not read now, but every time that msg is greater than 1 it calls the function emitSom(), but I just want you to call this Function when the ajax stay working, but it comes back with the notifications(so far so good)and calls the sound Function, that is every time you change pages the same calls the function that ends up irritating.

Code:

Ajax function:

function notificarNMsg(id, tp_usuario, codigo, ultimos_id) {
    ids = ultimos_id;
    $.ajax({
        url: 'pages/atualizacoes.php', /* URL que será chamada */
        type: 'POST', /* Tipo da requisição */
        data: {ANLid_usuario: id, ANLtp_usuario: tp_usuario, ANLcodigo: codigo, ultimos_id: ids},
        dataType: 'json', /* Tipo de transmissão */
        success: function (data) {
            if (data.msg_nao_lidas >= 0) {
                if (data.ids == 0) {
                    $("#areaMsg").html('<span></span>').removeClass("vibrarMsg");
                } else if (data.ids !== 0 && data.msg_nao_lidas > 0) {
                    qtd_existente = $("#areaMsg  span").text();
                    if (qtd_existente == '') {
                        qtd_existente = 0;
                    }
                    qtd_msg_total = parseInt(qtd_existente) + parseInt(data.msg_nao_lidas);
                    $("#areaMsg").html('<span>' + qtd_msg_total + '</span>').addClass("vibrarMsg");
                    acionarAlerta('./sons/nv_msg.wav');
                    trocarTituloPorTempo('- (' + qtd_msg_total + ') Mensagem');
                    if (ids != 0) {
                        ids = ids + ',' + data.ids.join(",");
                    } else {
                        ids = data.ids.join(",");
                    }
                }
            }
            notificarNMsg(id, tp_usuario, codigo, ids);
        }
    });
}

Function that should be "Created" after a few seconds.

function acionarAlerta(caminho) {
    var som = new Audio(caminho);
    som.play();
}

Answer 1

Wait for the event DOMContentLoaded document - this will indicate that the page has been completed. After that, you can implement a Timeout to be executed after N milliseconds.

// Aguarde a finalização da carga da página:
document.addEventListener("DOMContentLoaded", function(event) { 
    // Dispare um evento daqui a 5 segundos (5000 milissegundos):
    window.setTimeout(function () {
        // Redirecionando...
        location.href = "https://www.google.com";
    }, 5000);
});

Answer 2

You can listen to the cargo event from window, after that wait a while (using the function setTimeout) and then call its function.

window.addEventListener("load", function load(event) {
    setTimeout(function () {
        acionarAlerta("seu_caminho");
    }, 5000);
});

or

window.onload = function (event) {
    setTimeout(function () {
        acionarAlerta("seu_caminho");
    }, 5000);
});