Событие onbeforeunload слишком восторженно в IE9 - PullRequest
23 голосов
/ 01 сентября 2011

Вот пример тестового html:

<!DOCTYPE html>
<html>
  <body>
    <a href="javascript:alert('Not going anywhere!');">Go nowhere 1</a>
    <a href="javascript:void(0);" onclick="alert('Not going anywhere!');">Go nowhere 2</a>
    <a href="http://www.google.com">Go somewhere</a>
    <script type="text/javascript">
      window.onbeforeunload = function() { return "Really leave?"; };
    </script>
  </body>
</html>

Это доступно как рабочая страница здесь: timjeanes.com / ie9_onbeforeunload.htm

В Firefox, Chromeи Сафари, я получаю поведение, которое я хочу.То есть, щелкнув любую из первых двух ссылок, вы увидите диалоговое окно с предупреждением;Если щелкнуть по третьей ссылке (или иным образом перейти прочь), появится сообщение «Вы уверены, что хотите покинуть эту страницу?»сообщение.

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

Есть ли что-то, что я делаю неправильно?Или есть хороший обходной путь для IE?

Один из вариантов - использовать href = "#" и поместить мой javascript в onclick.Я не заинтересован в этом, так как он выводит пользователя наверх страницы, а моя настоящая страница довольно высокая.

Я не тестировал в других версиях IE.

Ответы [ 5 ]

17 голосов
/ 01 сентября 2011

Это довольно неудачная ошибка.Кажется, вам придется обойти это, и использование метода хэш-связи, вероятно, является лучшим способом.Чтобы пользователь не попал в верхнюю часть страницы, отмените событие, используя event.preventDefault() и event.returnValue = false.

function myClickHandler(e) {
    if (e.preventDefault)
        e.preventDefault();
    e.returnValue = false;
    alert("Not going anywhere!");
}

. Назовите его так:

<a href="#" onclick="myClickHandler(event)">Go nowhere 1</a>

Редактировать: Вы можете отменить событие для всех хеш-ссылок на вашей странице следующим образом:

var links = document.links;
for (var i = 0; i < links.length; i++) {
    var link = links[i];
    if (link.href == "#") {
        if (link.addEventListener) {
            link.addEventListener("click", cancelEvent, false);
        }
        else if (link.attachEvent) {
            link.attachEvent("onclick", cancelEvent);
        }
    }
}
function cancelEvent(e) {
    e = e || window.event;
    if (e.preventDefault)
        e.preventDefault();
    e.returnValue = false;
}

Или с помощью jQuery, используя только одну строку кода:

$("a[href='#']").click(function (e) { e.preventDefault(); });
5 голосов
/ 25 июня 2014

Более простое решение - использовать onunload в IE и onbeforeunload в других браузерах.

4 голосов
/ 03 декабря 2012

#null в href для предотвращения перехода на страницу, а не просто # и сценарий в onclick=""

2 голосов
/ 01 сентября 2011

Вы не должны связывать событие для клика, используя href="javascript:...: ниже это не хорошо.

<a href="javascript:alert('Not going anywhere!');">Go nowhere 1</a>

Если вы собираетесь использовать onclick и аннулировать href, просто верните false в onclick.

<a onclick="alert('Not going anywhere!');return false;">Go nowhere 2</a>
1 голос
/ 01 сентября 2011

На самом деле это не ошибка, что "Вы уверены, что хотите покинуть эту страницу?" сообщение выскакивает при нажатии на первую ссылку; в IE 9 это "особенность" - Больше причин мне не нравится IE

...