JavaScript：当他们关闭浏览器时，如何提示自定义消息框？

Question

Problem:

I am new in JavaScript. And I want to give a message like "you have down xxx works today,",
when my users close broswer. I've search google/stackoverflow and get some solutions in Prompt User before browser close?

BUT, when I try code as followd, it just shows the broswer's default message, not mine. How can I solve it?

Code:

function test(evt) {
    var message = 'Did you remember to download your form?';
    if (typeof evt == 'undefined') {
        evt = window.event;
    }
    if (evt) {
        evt.returnValue = message;
    }
    return message;
}

Are there some useful APIs or solutions for me?

Edit (2021.9.22) I try the tips posted By @NiceBooks like

window.addEventListener('beforeunload', function (e) {
    window.alert("ready to exit");
    window.confirm("just a test");
    e.returnValue = '';
});

IE and FireFox prompt their default message. If e.returnValue is not set, there is no prompt box when I click exit button. beforeunload says:

'In some browsers, calls to window.alert(), window.confirm(), and window.prompt() may be ignored during this event. See the HTML specification for more details. '

Maybe it's the reason why I failed. But is there really no solution?

Answer 1

You can try with the window.confirm(msg) function.

https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm

Use it in conjunction with the beforeunload event on the window object:

beforeunload in MDN

Answer 2

Try this, enter the following code inside the head tag.

<script>
const beforeUnloadListener = (event) => {
  event.preventDefault();
  return event.returnValue = "Are you sure you want to exit?";
};

//this piece of code will trigger a pupup message
addEventListener("beforeunload", beforeUnloadListener, {capture: true});
</script>

Hope this helps.