Jak správně zobrazit unload dotaz?

Z nejrůznějších důvodů již v nových prohlížečích nefunguje starý způsob zamezení opuštění stránky pomocí window.onunload nebo podobné způsoby.

Přesto existuje nová specifikace, která umožňuje zobrazení zprávy, ale již není tak jednoduchá a může se chovat různě.

Prvním důvodem je, že se událost přejmenovala z unload na beforeunload. Proto je potřeba příslušný handler registrovat na obě události:

//Vanilla JS
window.onunload = f;
window.addEventListener("unload", f);
window.addEventListener("beforeunload", f);
//jQuery
$(window).on('unload beforeunload', f);

Další změna je ta, že některé prohlížeče očekávají text pro zobrazení zprávy jako návratovou hodnotu funkce a jiné ji čekají jako vlastnost události:

unload = function(event) {
  //Firefox a IE
  if (event.originalEvent) { //jQuery event
    event.originalEvent.returnValue = '??';
  }
  else { //vanilla JS event
    event.returnValue = '??';
  }

  //Webkit (Chrome, Safari, ...)
  return '??';
}

Poslední změna je ta, že některé všechny prohlížeče kromě IE11 místo vámi dané zprávy zobrazí jen obecné „Opravdu chcete opustit stránku?“ nebo „Opuštěním stránky můžete přijít o data.“ a někdy mohou zprávu ignorovat úplně (například Chrome vyžaduje, aby uživatel alespoň jednou klikl do stránky, protože dokud uživatel neklikne, tak se nedá předpokládat, že by mohl ztratit něco neuloženého).

S ignorováním unload handleru se můžete setkat hlavně v případě, že se uvnitř metody budete pokoušet zobrazit alert, prompt apod. nebo budete provádět jiné akce (např. posílat ajax), které prohlížeč vyhodnotí jako nežádoucí.

Napsat komentář

Vaše e-mailová adresa nebude zveřejněna.

Tato stránka používá Akismet k omezení spamu. Podívejte se, jak vaše data z komentářů zpracováváme..