Предотвратить случайную навигацию пользователя

Question

Моя проблема немного сложнее, чем использование следующего простого кода JavaScript

window.onbeforeunload = function (e) {      
  return 'Are You Sure?';
};

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

1. закрытие вкладки / окна браузера
2. переход на другой домен

Метод JavaScript выше не решает мою проблему, потому что он вызывается, даже когда пользователь перемещается в домене.

Short:

1. Пользователь пытается закрыть окно -> Показать диалог
2. Пользователь меняет URL-адрес www.mydomain.com/shoppingcart на www.google.com в адресной строке браузера -> Показать диалоговое окно
3. Пользователь переходит на www.mydomain.com/checkout с помощью кнопки оформления заказа или нажимает кнопку возврата в браузере -> НЕ показывать диалог

Answer 1

Невозможно определить, нажал ли пользователь кнопку назад или закрыл вкладку, и у вас нет доступа к его предполагаемому местоположению.

Можно остановить отображение диалогового окна, если щелкнуть внутреннюю ссылку:

(function(){

    function isExternal( href ) {
        return RegExp('https?:\\/\\/(?!' + window.location.hostname + ')').test(href);
    }

    var returnValue = 'Are you sure?';

    document.documentElement.onclick = function(e){
        var target = e ? e.target : window.event.srcElement;
        if (target.href && !isExternal(target.href)) {
            returnValue = undefined;
        }
    };

    window.onbeforeunload = function(){
        return returnValue;
    };

})();

Answer 2

К сожалению, нет технического решения вашей "проблемы".

Это не случайность, когда пользователь решает покинуть ваш сайт, то есть, набрав новый URL, поэтому останавливать его, говоря: «Эй, вы еще не проверили» - это бессмысленно.

Answer 3

Я бы посоветовал разрешить посетителю свободно покидать ваш сайт и просто запоминать его информацию (БД, сеансы и т.д.) С точки зрения электронной коммерции это вежливый способ удержания клиентов.

Если кто-то захочет покинуть ваш сайт, он уйдет. Предварительная двойная проверка, скорее всего, только раздражает клиента и снижает вероятность его возвращения.

Answer 4

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

Я обнаружил, что это вас интересует, кажется хорошим решением: http://www.4guysfromrolla.com/demos/OnBeforeUnloadDemo1.htm

Answer 5

Похоже, вам нужно использовать onbeforeunload, а затем изменить все свои внутренние ссылки, чтобы отключить его. Вероятно, для последнего было бы событие jQuery; фактический hrefs прогон через JS был бы ужасен, не в последнюю очередь потому, что он победил бы сканирование поисковой системы.

Answer 6

Поскольку объект beforeUnload-Event НЕ содержит местоположение, к которому пытается перейти пользователь, одним из "хаков" для этого будет добавление прослушивателей кликов ко всем ссылкам на вашем сайте и отключение прослушивателя unload в этом обработчик. Это не очень красиво, и, вероятно, не будет работать, если пользователь перемещается с помощью клавиатуры, но на данный момент это мое лучшее предположение.