Как я могу определить, когда пользователь покидает мой сайт, а не просто идет на другую страницу?
У меня есть обработчик для 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();
});
Что происходит, так это то, что тело становится активным элементом в цели в этих случаях (когда пользователь покидает веб-сайт), и это не тот случай, когда пользователь нажимает на внутренние навигационные элементы веб-сайта.
Это простое и простое решение. Дайте мне знать, если вы столкнулись с какими-либо проблемами.