Как я могу определить, когда пользователь покидает мой сайт, а не просто идет на другую страницу?

У меня есть обработчик для onbeforeunload

window.onbeforeunload = unloadMess;
function unloadMess(){
  var conf = confirm("Wait! Before you go, please share your stories or experiences on the message forum.");
    if(conf){
    window.location.href = "http://www.domain.com/message-forum";
    }
}

но я не уверен, как узнать, находится ли URL-адрес, который они нажали на странице, на сайте.

Я просто хочу, чтобы они предупредили их, если они покинут сайт.

Ответ 1

Невозможно сделать это на 100% надежно, но если вы обнаружите, когда пользователь нажал ссылку на вашей странице, вы можете использовать это как наиболее правильный сигнал. Что-то вроде этого:

window.localLinkClicked = false;

$("a").live("click", function() {
    var url = $(this).attr("href");

    // check if the link is relative or to your domain
    if (! /^https?:\/\/./.test(url) || /https?:\/\/yourdomain\.com/.test(url)) {
        window.localLinkClicked = true;
    }
});

window.onbeforeunload = function() {
    if (window.localLinkClicked) {
        // do stuff
    } else {
        // don't
    }
}

Ответ 2

У меня есть одна идея, но я не знаю, работает ли она. Мое предложение: добавьте каждую ссылку в событие onClick с вызовом функции. Эта функция считывает только атрибут href и хранится в переменной с глобальной областью.

var clickedHrefAttrValue = "";
function getClickUrl(currentLink)
{
   clickedHrefAttrValue = $(currentLink).attr("href");
   return true;
}

html для тегов a должен выглядеть следующим образом:

<a href="<url>" onClick="getClickUrl(this)">Linktext</a>

и в вашей заданной функции:

function getClickUrl()
{
   if (clickedHrefAttrValue.indexOf("<your condition>" > -1)
   {
     //what ever you want do to
   }
}

Это просто идея, но я думаю, что стоит попробовать.

Ответ 3

Если у вас возникли проблемы, потому что ваш сайт может иметь как абсолютные, так и относительные локальные ссылки, у меня есть другое решение (с помощью jQuery):

Демо

/* EXTERNAL LINK WARNING
=========================================*/
$('a').on('click', function(e){
    e.preventDefault();
    var url = $(this).attr('href'),
        host = location.host;       
    if (url.indexOf(host) > -1 || url.indexOf('http','https') == -1){
        /* If we find the host name within the URL,
               OR if we do not find http or https, 
               meaning it is a relative internal link
            */
        window.location.href = url;
    } else {
        var warn = confirm('You\'re leaving the domain.\n\nAre you sure?');
        if(warn == true) {
            window.location.href = url,'_blank';
        } else {
            e.preventDefault;
        }
    }
});

Ответ 4

$(document).ready(function () {
    var base_url_protocol = window.location.protocol + "//";
    var base_url = base_url_protocol + window.location.hostname;
    var base_url_length = base_url.length;

    $("a").click(function () {

        var link_location = $(this).attr('href');

        // if the link clicked is external  
        if (link_location.indexOf(base_url_protocol) != -1 && link_location.substr(0, base_url_length) != base_url) {

            /* DO ACTION HERE */
        }

    });

});

Ответ 5

Есть хорошее решение для этого, которое я недавно реализовал на своем веб-сайте. Только представьте себе, что все, что будет на вашем веб-сайте, которое перемещает пользователя, либо будет ссылкой (якорный тег), кнопкой, кликабельным изображением, либо что-то в этих строках. Его определенно не будет элементом тела.

Теперь, что происходит, когда пользователь покидает веб-сайт, он может либо ввести URL-адрес, либо нажать Enter, щелкнуть закладку или нажать кнопки назад/вперед.

Когда пользователь делает это, сделайте следующее:

$(window).on('beforeunload', function(e)){
    if(e.target.activeElement.nodeName.toLowerCase() == 'body'){
       yourFunction();
});

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

Это простое и простое решение. Дайте мне знать, если вы столкнулись с какими-либо проблемами.