Afficher une boîte de dialogue personnalisée lorsque l'utilisateur quitte le navigateur?

Question

Oui, je me rends compte que c'est horrible UI et mauvaise accessibilité sage, mais je suis obligé de chercher les options en raison de travaux sous contrat (à laquelle je ne suis pas d'accord et je suis coincé avec).

Je sais que vous pouvez attribuer un gestionnaire d'événements à onbeforeunload comme:

window.onbeforeunload = function() { 
    return 'You have unsaved changes!'; 
} 

Cela entraînerait une boîte de dialogue générée par le système d'exploitation/navigateur qui ne peut pas être personnalisé. Il vous demandera d'annuler votre demande ou continuer.

Jusqu'à présent, il semble que la seule façon dont je peux afficher tout-ness personnalisé est en insérant un window.open dans ce gestionnaire d'événements:

window.onbeforeunload = function() { 
    var x = window.open('modal.html'); 
} 

Ce serait fort probablement bloqué par un navigateur moderne comme un « pop-up » . Je dois afficher une toute nouvelle page avec mon dialogue, mais cela semble être le seul moyen de répondre à la demande.

Est-ce à peu près la seule option que j'ai? Autre que de dire avec force au client, il n'est pas recommandé de le faire?

La seule autre option serait que l'utilisateur appuie sur "Annuler la demande", puis insère la boîte de dialogue.

questions que je déjà regardé:

• jQuery UI Dialog OnBeforeUnload
• How can I override the OnBeforeUnload dialog and replace it with my own?

Answer 1

Je suis juste allé le onbeforeunload de route window.open.

Answer 2

Comme par les questions que vous déjà regardé, vous ne pouvez pas personnaliser cette boîte de dialogue au-delà de passer dans un message de chaîne être affiché par le navigateur.

window.onbeforeunload - MDC

Answer 3

vous pouvez utiliser un flash caché .swf que vous révélez au moment onbeforeunload au lieu de window.open