it-swarm.com.ru

Диалоговое окно работает в течение 1 секунды и исчезает?

Я запускаю диалоговое окно, когда пользователь покидает страницу. Единственное, он работает в течение 1 секунды и исчезает? Я знаю, что это связано с bind('beforeunload'), но диалог умирает раньше, чем вы можете его прочитать.

Как я могу предотвратить это?

$(document).ready(function() {  

    // Append dialog pop-up modem to body of page
    $('body').append("<div id='confirmDialog' title='Confirm'><p><span class='ui-icon ui-icon-alert' style='float:left; margin:0 7px 20px 0;'></span>Are you sure you want to leave " + brandName + "? <br /> Your order will not be saved.</p></div>");

    // Create Dialog box
    $('#confirmDialog').dialog({
      autoOpen: false,
      modal: true,
      overlay: {
        backgroundColor: '#000',
        opacity: 0.5
      },
      buttons: {
        'I am sure': function() {
          var href = $(this).dialog('option', 'href', this.href);
          window.location.href = href;
        },
        'Complete my order': function() {
          $(this).dialog('close');
        }
      }
    });

    // Bind event to Before user leaves page with function parameter e
    $(window).bind('beforeunload', function(e) {    
        // Mozilla takes the
        var e = $('#confirmDialog').dialog('open').dialog('option', 'href', this.href);
        // For IE and Firefox prior to version 4
        if (e){
            $('#confirmDialog').dialog('open').dialog('option', 'href', this.href);
        }
        // For Safari
        e.$('#confirmDialog').dialog('open').dialog('option', 'href', this.href);
    }); 

    // unbind function if user clicks a link
    $('a').click(function(event) {
        $(window).unbind();
        //event.preventDefault();
        //$('#confirmDialog').dialog('option', 'href', this.href).dialog('open');
    });

    // unbind function if user submits a form
    $('form').submit(function() {
        $(window).unbind();
    });
});
59
user154107

beforeunload использует метод, встроенный в браузер, вам нужно вернуть ему строку, и браузер отобразит строку и спросит пользователя, хотят ли они покинуть страницу.

Вы не можете использовать свои собственные диалоговые окна (или модальные диалоговые окна jQueryUI) для переопределения beforeunload.

beforeunload не может перенаправить пользователя на другую страницу.

$(window).on('beforeunload', function(){
  return 'Are you sure you want to leave?';
});

Это заставит всплывающее окно с сообщением 'Are you sure you want to leave?' и спросит пользователя, хотят ли они покинуть страницу.

(ОБНОВЛЕНИЕ: Firefox не отображает ваше собственное сообщение, оно только отображает его.)

Если вы хотите запустить функцию во время выгрузки страницы, вы можете использовать $(window).unload(), просто обратите внимание, что она не может остановить страницу от выгрузки или перенаправить пользователя. (ОБНОВЛЕНИЕ: предупреждения о блокировке Chrome и Firefox в unload.)

$(window).unload(function(){
  alert('Bye.');
});

Демонстрация: http://jsfiddle.net/3kvAC/241/

Обновление:

$(...).unload(...) is устарело , так как jQuery v1.8, вместо этого используйте:

$(window).on('unload', function(){
});
153
Rocket Hazmat

Вы также можете использовать следующий метод выгрузки, представленный Microsoft для достижения этой цели . Нажмите здесь , чтобы увидеть живую демонстрацию.

function closeIt()
  {
    return "Any string value here forces a dialog box to \n" + 
         "appear before closing the window.";
  }
  window.onbeforeunload = closeIt;

Нажмите , чтобы прочитать документацию Microsoft.

3
kbvishnu

В моем случае я использую его, чтобы показать «предварительный загрузчик» перед переходом к другой части моего веб-приложения, так что это совпадает с «предварительным загрузчиком», который появляется на новой открытой странице, для эстетического изменения между страницами.

То, что это работало для меня (и я попробовал все), было этим:

function myLoader() {
    // Show my Loader Script;
}

$( window ).on( 'beforeunload' , function() {
    myLoader();
} );
0
DeathMomo