Событие onbeforeunload с энтузиазмом относится к IE9

Вот пример тестового 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="#" onclick="location.href='http://www.google.com'; return false;">Go somewhere</a>
    <script type="text/javascript">
      window.onbeforeunload = function() { return "Really leave?"; };
    </script>
  </body>
</html>

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

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

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

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

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

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

Ответ 1

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

Ответ 2

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

Ответ 3

#null в href для предотвращения перескакивания страницы, а не только # и script в onclick=""

Ответ 4

Нельзя привязывать событие к клику с помощью href="javascript:...: ниже не хорошо.

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

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

<a onclick="alert('Not going anywhere!');return false;">Go nowhere 2</a>

Ответ 5

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