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 emailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *

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