Попытка выяснить, как сделать модальное всплывающее окно в окне браузера. Я знаю, как сделать окно предупреждения, но я хочу, чтобы пользователи ответили на вопросник при выходе, вместо основного окна «вы уверены, что хотите покинуть».Modal Popup on Window Exit
ответ
window.onbeforeunload = function() {
return 'Your content has not been properly saved yet!';
};
Это заставит браузер отобразить окно подтверждения, как этот:
http://f.cl.ly/items/2L0t1k0d2U0p0Z0z1d2t/Screen%20shot%202012-02-14%20at%206.09.58%20PM.png
Как вы можете видеть, строка, возвращаемая функцией отображается в коробке.
Вы не можете. Единственный способ остановить закрытие окна - использовать JS Confirm (или предупреждение). Если бы вы только что всплыли на модной странице, окно все равно было бы закрыто, и вы никогда его не увидели. Лучше всего открыть оповещение JS, а затем перенаправить страницу на вопрос. Хотя обратите внимание, что это невероятно раздражает пользователя.
Итак, нужно было бы использовать окно оповещения, а затем попросить их оставить отпуск, если они уйдут, может ли он появится модальный? – THEDert
Если они уйдут, они исчезнут, так что нет. – MetalFrog
Вы должны привязываться к событию 'unload' документа. – bfavaretto
Хотя это не всегда рекомендуется ставить код на выходе, вы могли бы сделать что-то вроде этого:
<body onUnload="javascript:openDialog()">
или
$(document).bind('unload', openDialog);
Тогда:
function openDialog(e) {
e.preventDefault();
$("#yourQuestionnaire").dialog('open');
}
Но вообще это хорошая практика, чтобы избежать привязки к событию onUnload
, потому что его fi кольцо не является надежным во всех браузерах и ситуациях.
UPDATE
документация показывает, как:
$(window).unload(function() {
alert('Handler for .unload() called.');
});
Это работает для меня при применении его с помощью консоли Firefox/Firebug на любой странице StackOverflow.
Документация здесь: http://api.jquery.com/unload/
Я не думаю, что это сработает. Окно по-прежнему будет закрыто, есть ли предупреждение onDunault onunload, не так ли? –
Это просто не работает. Любой современный браузер не позволит вам это сделать. – wdev
Вы правы, я обновил лучшее решение и высветил раздел, предупреждающий об использовании его, поскольку обычно не рекомендуется связывать его с выгрузкой (как было сказано ранее). – shanabus
У меня были схожие требования, когда я хотел использовать приятное сообщение HTML вместо сообщения js по умолчанию. Проведя некоторое время, я наконец нашел способ сделать это. Я использовал jQuery Colorbox, который очень полезен в любых модальных требованиях, а не только здесь.
В принципе вы можете использовать событие mousemove
и найти, если координата Y (e.clientY
) меньше 5. Таким образом, он будет запущен каждый раз, когда мышь находится возле адресной строки (пользователь вводит новый URL-адрес или пытается закрыть окно).
jQuery(document).ready(function() {
jQuery(document).mousemove(function(e) {
if (e.clientY <= 5) {
jQuery.colorbox({initialHeight: 250, initialWidth: 250, html:'<h2>any custom HTML here</h2><br/><img src="nice-img" />'});
}
});
});
Я нашел много примеров, используя e.pageY
, но учтите, что он будет запущен, только если пользователь не прокрутил вниз. Поэтому, если вы прокрутите вниз даже на 5 пикселей, e.pageY
не будет работать, но e.clientY
будет работать. e.pageY
дает смещение, в то время как e.clientY
дает абсолютную координату. Очень важно!
Есть ли способ редактировать текст «остаться на этой странице» и «оставить эту страницу»? – THEDert
Нет, я так не думаю. –
А, это отстой .... спасибо за ваше решение !! – THEDert