Мне нужен сценарий сообщения, который будет появляться только тогда, когда люди покидают текущую веб-страницу, а не текущий веб-сайт.
Когда люди полностью покидают веб-сайт, появится сообщение, и им нужно будет нажать кнопку «ОК», чтобы остаться на текущей странице (и отменить, чтобы покинуть веб-сайт).
Скрипт может не работать, когда люди действительно остаются на веб-сайте или когда они нажимают на внутренние ссылки или страницы.
Можно ли это сделать?
Ознакомьтесь с этот очень простой пример решения. Он устанавливает обработчик onbeforeunload, но затем удаляет его, если пользователь щелкает внутреннюю ссылку. Ниже приведена общая версия кода из примера решения.
HTML:
<a href="internal_link.html">internal link</a>
<a href="http://www.example.com">external link</a>
JS (использует jQuery):
window.onbeforeunload = function(){
return "Are you sure you want to leave our website?";
}
$(function(){
$('a, input, button').click(function(){
window.onbeforeunload = null;
});
});
<a href="internal_link.html">internal link</a> — это просто пример ссылки, которая будет иметь то же доменное имя, что и location.host. Любая ссылка, которая является внутренней для вашего веб-сайта (то есть она не ведет на другой домен), должна привести к тому, что оператор if this.href.match(location.host) вернет true, в результате чего обработчик onbeforeunload будет удален, что предотвратит появление сообщения "Are you sure you want to leave our website?" сообщения. [... продолжение комментария ниже...]
- person Adam; 02.06.2010
<a href="http://www.example.com">external link</a>), будут вызывать всплывающее сообщение (по вашему желанию), поскольку они будут иметь домен, отличный от location.host. (Извините, если возникла путаница из-за того, что я забыл обработчик onbeforeunload в моем первом сообщении. Пожалуйста, обратитесь к примеру решения polymath.mit.edu/projects/test/stackoverflow/, если у вас есть другие вопросы.)
- person Adam; 02.06.2010
if оператор @Adam, оказывается, кто-то отредактировал свой ответ, чтобы улучшить его, но на самом деле значительно изменил его, поэтому проверки внутренней и внешней ссылки больше нет. См. stackoverflow.com/posts/2925855/revisions.
- person redfox05; 19.02.2019
У меня возникла аналогичная проблема. Однако в моем случае это сообщение должно было быть переведено в соответствии с языком пользователя, если кто-то нажмет F5 или закроет окно.
Следуйте моему маленькому примеру.
<html>
<head>
<script type="text/javascript">
function closeThis()
{
if (window.confirm("Minha mensagem!")){
window.close();
}
}
function test()
{
// Add a warning in case anyone tries to navigate away or refresh the page
return confirm("Minha mensagem");
}
</script>
</head>
<body onbeforeunload=test();>
<p>Hello World! Press F5 or Close this Window</p>
</body>
</html>
В большинстве случаев вам не нужно всплывающее окно для всех событий, кроме одного: пользователь закрывает окно.
Вот мое решение для этого:
$(window).on('beforeunload', function() {
/* whatever you want here */
}
$(document).on('click keydown', function(){
$(window).off('beforeunload');
});
