javascript - w3school - window onunload function




Come posso impedire che window.onbeforeunload venga attivato da javascript: href link in IE? (4)

Sto creando un fail safe per il mio modulo che avverte gli utenti che se lasciano la pagina i loro dati del modulo andranno persi (in modo simile a quello che fa Gmail).

window.onbeforeunload = function () {    
        if (formIsDirty) {
            return "You have unsaved data on this form. Don't leave!";
        }
}

La funzione di cui sopra funziona benissimo in firefox, ma in IE viene attivato da qualsiasi link href, anche quelli che sono link a javascript e non altre pagine.

per esempio....

<a href='javascript:someFunction();'>click</a>

Mi chiedo se c'è un modo per aggirare questo, perché non voglio che l'utente pensi di lasciare la pagina quando sta semplicemente facendo clic su un pulsante. Non ho la possibilità di riscrivere tutti i vari link in quanto sono integrati e numerosi.

Qualche idea?


È possibile rimuovere e riassegnare il onbeforeunload al passaggio del mouse su questi collegamenti:

jQuery(
  function($)
  {
      //store onbeforeunload for later use
    $(window).data('beforeunload',window.onbeforeunload);  

      //remove||re-assign onbeforeunload on hover 
    $('a[href^="javascript:"]')
      .hover( 
             function(){window.onbeforeunload=null;},
             function(){window.onbeforeunload=$(window).data('beforeunload');}
            );

  }
);

(Come alcune altre risposte, è necessario modificare il modo in cui è associato il codice JavaScript. Se ciò non funziona, ignorare.)

Ho trovato che in IE 7 tramite IE 10, semplicemente usando jQuery .click () con preventDefault funziona senza mostrare il messaggio onbeforeunload (IE 11 non mostra il messaggio beforeunload per nessuno dei miei casi di test). Questo è vero se href è "#" o javascript:void(0) . Mi aspetto che la conclusione sia valida se attachEvent / addEventListener è usato direttamente, ma non l'ho verificato.

C'è una demo di sotto a http://jsbin.com/tatufehe/1 . Entrambe le versioni (in verde) con preventDefault funzionano (non mostrare la finestra di dialogo beforeunload ). Quello senza preventDefault lo mostra (come confronto).

$( document ).ready( function () {
  $( 'a' ).click( function ( evt ) {
    $( '#display' ).text( 'You clicked: ' + $( this ).text() );

    if ( $(this).hasClass( 'withPreventDefault' ) ) {
      evt.preventDefault();
    }
  } );
})

window.onbeforeunload = function () {
  return "Are you sure you want to leave?";   
};
<p id="display"></p>

<p><a class="withPreventDefault" href="#">Number sign link *with* preventDefault</a></p>

<p><a class="withPreventDefault" href="javascript:void(0);">JavaScript href link *with* preventDefault</a></p>

<p><a href="javascript:void(0);">JavaScript href link *without* preventDefault</a></p>

Se il mouse dell'utente si trova su un collegamento e attiva la pagina di aggiornamento con la tastiera o attiva un collegamento con la tastiera, il prompt non verrà visualizzato. Quindi l'approccio di Dr.Molle non funzionerà in questo raro caso.


Se includi il simbolo di un segnalibro nella href del tag a, dovresti essere in grado di utilizzare ancora l'evento onclick per includere il tuo JavaScript.

<a href="#" onclick='someFunction();'>click</a>

Ho eseguito una serie di test e questo sembra eseguire JavaScript senza attivare l'evento onbeforeunload. Sarei curioso di sapere se questo funziona per gli altri o se hai ancora lo stesso problema dopo aver implementato un tag in questo modo.





onunload