2011-08-31 11 views
23

aquí hay algo de html prueba de muestra:caso onbeforeunload es demasiado entusiasta en IE9

<!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> 

Esto está disponible como una página de trabajo aquí: timjeanes.com/ie9_onbeforeunload.htm

En Firefox, Chrome y Safari, consigo el comportamiento Quiero . Es decir, al hacer clic en cualquiera de los dos primeros enlaces, aparece un cuadro de diálogo de alerta; al hacer clic en el tercer enlace (o navegar de otro modo) se muestra "¿Seguro que quieres salir de esta página?" mensaje.

Sin embargo, en IE9, "¿Seguro que quieres salir de esta página?" El mensaje también se muestra cuando hace clic en cualquiera de los primeros dos enlaces, aunque no se está navegando, solo estamos ejecutando JavaScript.

¿Hay algo que estoy haciendo mal? ¿O hay una buena solución para IE?

Una opción sería utilizar href = "#" y poner mi javascript en el clic. No estoy interesado en eso, ya que lleva al usuario a la parte superior de la página, y mi página de la vida real es bastante alta.

No he probado en otras versiones de IE.

+4

De todos modos es realmente repugnante poner su JavaScript en el "href". Ponlo en el atributo del controlador de eventos o, mejor aún, adjúntalo dinámicamente con un código JavaScript discreto separado. Si los controladores de eventos cancelan la acción predeterminada del clic, el navegador no desplazará la página. – Pointy

+1

Sí, estoy usando JavaScript no intrusivo en la vida real; Solo quería mantener las cosas breves en el código de muestra. Ponerlo en la href fue demostrar que esa no era una solución. Gracias sin embargo. – teedyay

+1

OK entonces, continúe :-) – Pointy

Respuesta

17

Eso es un error bastante desafortunado. Parece que tendrás que evitarlo, y usar el método de enlace hash es probablemente la mejor manera. Para evitar llevar al usuario a la parte superior de la página, cancele el evento usando event.preventDefault() y .

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

llamada así:

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

Editar: Se puede cancelar el evento para todos los hash enlaces de una página como esta:

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; 
} 

O con jQuery usando solo una línea de código:

$("a[href='#']").click(function (e) { e.preventDefault(); }); 
+1

¡Oh, me gusta esto! Fui por '$ ('a [href = #]'). Live ('clic', función (e) {e.preventDefault();});' para cubrir hipervínculos que se crean más tarde (es bastante dinámico página). – teedyay

2

No debe vincular un evento para hacer clic usando href="javascript:...: A continuación no es bueno.

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

Si vas a usar un onclick y anular la href luego simplemente return false en el onclick.

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

Tenga en cuenta que si no tiene un href, entonces no obtendrá un cursor de puntero cuando pase el mouse sobre el enlace. Si quiere el cursor del puntero: Puede establecer href en "#". O hazlo en CSS así: http://stackoverflow.com/questions/2409836/how-to-set-cursor-style-to-pointer-for-links-without-hrefs –

1

En realidad, no es un error que el "¿Estás seguro de que quieres salir de esta página?" aparece un mensaje al hacer clic en los primeros enlaces; que parece ser una "característica" en IE 9 - More reasons I dislike IE

+0

Veo que el documento dice: "Valor predeterminado acción: señala que el documento está a punto de descargarse ". ¡Pero no se está descargando nada! Flippin 'IE. Realmente pensé que la versión 9 se lo quitaría de la ranura número uno en mi lista de navegadores más jurados, pero no. – teedyay

4

#null en href para evitar la página de saltar en lugar de sólo # y guión en onclick=""

5

Una solución más simple es utilizar onunload en IE y onbeforeunload en otros navegadores .

+0

Esto funcionó para mí ... Lo cambié para onunload y ahora funciona en todos los navegadores ... – Rich701