window.onbeforeunload non funziona sull'iPad?

84

Qualcuno sa se l' onbeforeunloadevento è supportato su iPad e / o se c'è un modo diverso di usarlo?

Ho provato praticamente di tutto e sembra che l' onbeforeunloadevento non si sia mai attivato sull'iPad (browser Safari).

Nello specifico, questo è quello che ho provato:

  • window.onbeforeunload = function(event) { event.returnValue = 'test'; }
  • window.onbeforeunload = function(event) { return 'test'; }
  • (entrambi i precedenti insieme)
  • window.onbeforeunload = function(event) { alert('test')'; }
  • (tutte le funzioni di cui sopra ma all'interno <body onbeforeunload="...">

Tutti questi funzionano su FF e Safari su PC, ma non su iPad.

Inoltre, ho fatto quanto segue subito dopo aver caricato la pagina:

alert('onbeforeunload' in window);
alert(typeof window.onbeforeunload);
alert(window.onbeforeunload);

Rispettivamente, i risultati sono:

  • true
  • object
  • null

Quindi, il browser ha la proprietà, ma per qualche motivo non viene attivato.

I modi in cui cerco di uscire dalla pagina sono facendo clic sui pulsanti Indietro e Avanti, effettuando una ricerca su Google nella barra in alto, cambiando posizione nella barra degli indirizzi e facendo clic su un segnalibro.

Qualcuno ha idea di cosa sta succedendo? Apprezzerei molto qualsiasi contributo.

Grazie

javascript  ios  ipad  onbeforeunload 
— Art Zambrano
fonte
Grazie ad entrambi per il vostro contributo. Deve essere uno dei motivi che hai citato. Sfortunatamente, non esiste alcuna documentazione ufficiale di Apple riguardo a questa e altre limitazioni. Si spera che escogiteranno un modo più creativo per abilitare questa funzione, prevenendone l'uso dannoso. Sento molto spesso che le persone si allontanano accidentalmente dalla pagina e perdono tutti i dati che avevano inserito in un modulo.
— Art Zambrano
Hai provato a usare addEventListener()?
— Hello71
2
Sono abbastanza sicuro beforeunloadche non funzioni su Safari su iOS. :-( Forse non è quello che stai cercando, ma ho un suggerimento su come testare in modo affidabile per un lavorobeforeunload
— Peter V. Mørch
1
Il 3 marzo 16, The window.onbeforeunload = function(event) { event.returnValue = 'test'; }non funziona sia su Chrome che su Safari di iOS 9.2.1. Mi piace molto onbeforeunloadPerché la pagina non cambia se faccio clic su Annulla.
— vanduc1102
1
Questo evento dovrebbe essere supportato nei dispositivi mobili Iphone / Ipad e IOS. Ha un impatto enorme sull'analisi del tempo sul sito / utente. Funziona su tutti i browser e desktop tranne i dispositivi mobili IOS. saleemkce.github.io/timeonsite
— webblover

Risposte:

20

Ho scoperto che l'evento onunload () si attiva. Il suo comportamento è piuttosto strano; tutto ciò che hai nella funzione di callback allegata all'evento viene effettivamente eseguito dopo che la nuova pagina è stata caricata in background (non puoi ancora dire che è caricata, ma la registrazione del server mostrerà che lo ha fatto).

Più stranamente, se hai una chiamata confirm () nel tuo onunload () e l'utente ha fatto clic su un collegamento per andare da qualche altra parte, sei in affari. Se, tuttavia, l'utente chiude la scheda del browser Safari dell'iPad, verrà attivato l'evento onunload (), ma la tua confirm () avrà come risposta un annullamento implicito.

— Danny Armstrong
fonte
Eh, sembra che questa stranezza di conferma (che la seconda pagina venga aperta prima del messaggio di conferma) sia vera non solo per Safari mobile ma anche per Firefox (e probabilmente altri). Mi hai appena fatto impazzire.
— Amalgovinus
4
unloadevento deprecato a favore di pagehidevedere developer.apple.com/library/ios/documentation/AppleApplications/…
— sol0mka
1
@ sol0mka: Questo è tutto, amico! Grande! Nel mio caso il codice seguente ha funzionato, per quanto posso vedere per tutti i miei browser E iOS: $ (window) .on ('beforeunload pagehide', function () {// le mie cose che devono essere fatte a pagina modificare } ); Questa dovrebbe essere la risposta accettata ai miei occhi.
— Garavani
18

Questo bit di JavaScript funziona per me su Safari e Chrome su iPad e iPhone, nonché su desktop / laptop / altri browser:

var isOnIOS = navigator.userAgent.match(/iPad/i)|| navigator.userAgent.match(/iPhone/i);
var eventName = isOnIOS ? "pagehide" : "beforeunload";

window.addEventListener(eventName, function (event) { 
    window.event.cancelBubble = true; // Don't know if this works on iOS but it might!
    ...
} );
— Pericolo
fonte
1
Può catturare l'evento, ma come puoi far apparire il prompt di conferma? L'uso return 'test';simile a quello di op non funziona ..
— user2335065
Grazie, mi è sfuggito nella domanda originale. Non l'ho testato specificamente su iOS, ma forse l'aggiunta di questa riga aggiuntiva potrebbe funzionare: window.event.cancelBubble = true; Aggiungerò alla mia risposta
— Pericolo
2
Grazie, ma purtroppo non funziona ... Ho provato a mettere alert () al suo interno, sembra che la nuova pagina abbia iniziato a caricarsi prima che venga lanciata alert (). Si veda anche questo: stackoverflow.com/questions/3239834/...
— user2335065
@ user2335065 hai trovato qualche soluzione per lo stesso.
— Neeraj Rathod
ragazzi, avete trovato qualche soluzione per mostrare la richiesta di conferma prima di lasciare la pagina? Funziona bene in tutti i browser tranne IOS Safari. Ho provato anche pagehide event, ma non ha funzionato per me. Grazie in anticipo.
— Rahul
6

Solo Apple lo saprebbe con certezza, ma la mia ipotesi è che intenzionalmente non abbiano abilitato quella funzionalità in Safari mobile perché è spesso utilizzata da personaggi loschi per farti rimanere sul loro sito o far apparire molte finestre porno / pubblicitarie.

— Charles Boyung
fonte
56
Oppure, sai, salva automaticamente le modifiche in modo che non vengano perse solo perché hai toccato accidentalmente la cosa sbagliata.
— Joel Mueller
4
Non ho detto che non c'erano usi validi, ho solo detto che quelli erano gli usi più frequenti.
— Charles Boyung
3
@JoelMueller Il tuo commento dovrebbe essere la risposta accettata :)
— sanchez
1
@ JoelMueller Questo è esattamente il mio caso d'uso. Grrr @ apple
— user2808054
@JoelMueller puoi condividere qualsiasi documento ufficiale in cui possiamo affrontare questa affermazione che Safari mobile salva automaticamente le modifiche.
— Neeraj Rathod
2

Ecco una soluzione che dovrebbe funzionare su tutti i browser moderni:

var unloaded = false;
window.addEventListener("beforeunload", function(e)
{
    if (unloaded)
        return;
    unloaded = true;
    console.log("beforeUnload");
});
window.addEventListener("visibilitychange", function(e)
{
    if (document.visibilityState == 'hidden')
    {
        if (unloaded)
            return;
        unloaded = true;
        console.log("beforeUnload");
    }
});

I browser mobili non tendono a non supportare beforeunloadperché il browser può andare in background senza scaricare la pagina, quindi essere ucciso dal sistema operativo in qualsiasi momento.

La maggior parte dei browser desktop contiene un bug che causa la visibilityStatemancata chiamata quando il documento viene scaricato. Vedi: qui .

Pertanto, è importante includere entrambi gli eventi per coprire tutti gli scenari.

NB

L'ho usato al console.logposto del alertmio esempio perché alertverrà bloccato da alcuni browser quando viene chiamato da beforeunloado visibilitychange.

— Dan Bray
fonte
1

Se hai solo bisogno di sapere se la pagina è stata lasciata puoi usare document.unload. Funziona bene nei browser ios. Se vedi nella documentazione Apple , scoprirai che è deprecato e ti consigliano di utilizzare document.pagehide

— Miquel
fonte
sì, questo evento si attiva in Safari, ma il prompt di conferma non arriva come in Chrome.
— Rahul
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.