Događa se Javascript napuštanje stranice. JavaScript - Window Object: Otvaranje i zatvaranje prozora. Metode objekata prozora: open(), close(), print(), focus() i blur()



prozor js događaji (14)

Želim snimiti događaj zatvaranja prozora preglednika/kartice. Pokušao sam sljedeće s jQueryjem:

JQuery(window).bind("beforeunload", function() ( return confirm("Želite li stvarno zatvoriti?") ))

Ali radi i s podnošenjem obrazaca, što nije ono što želim. Želim događaj koji se pokreće samo kada korisnik zatvori prozor.

Od jQuery 1.7, metoda .live() je zastarjela. Koristite .on() za prilaganje rukovatelja događajima. Stariji korisnici jQuery verzije treba koristiti .delegate() umjesto .live()

$(window).bind("beforeunload", function() ( return true || confirm("Želite li stvarno zatvoriti?"); ));

$(prozor).unbind();

JQuery(window).bind("beforeunload", function (e) ( var activeElementTagName = e.target.activeElement.tagName; if (activeElementTagName != "A" && activeElementTagName != "INPUT") ( return "Da li stvarno želite zatvoriti?"; ) ))

Moj odgovor je usmjeren na pružanje jednostavnih testova.

KAKO

Vidi @SLaks odgovor.

$(window).on("beforeunload", function() ( return inFormOrLink ? "Želite li stvarno zatvoriti?" : null; ))

Koliko će trebati pregledniku da konačno zatvori stranicu?

Kad god korisnik zatvori stranicu (gumb x ili CTRL+W), preglednik se pokreće ovaj kod prije beforeunload , ali ne na neodređeno vrijeme. Jedina iznimka je prozor za potvrdu (povratak "Želite li stvarno zatvoriti?"), koji će čekati odgovor korisnika.

Chrome: 2 sekunde.
Firefox: ∞ (ili dvaput kliknite ili prisilno zatvorite)
Rub: ∞ (ili dvostruki klik)
Explorer 11: 0 sekundi.
Safari: NAPRAVITI

Što smo koristili za ovo testiranje:

  • Node.js Express poslužitelj s zapisnikom zahtjeva
  • Sljedeća kratka HTML datoteka

Ono što radi je slanje što više zahtjeva prije nego što preglednik završi svoju stranicu (sinkrono).

function request() ( return $.ajax(( tip: "GET", url: "http://localhost:3030/" + Date.now(), async: true )).responseText; ) window.onbeforeunload = ( ) => ( while (true) ( ​​​​request(); ) return null; )

Chrome izlaz:

GET /1480451321041 404 0,389 ms - 32 GET /1480451321052 404 0,219 ms - 32 ... GET /hello/1480451322998 404 0,328 ms - 32 1957ms ≈ 2 sekunde // pretpostavljamo da su 2 sekunde jer za zahtjeve može biti potrebno nekoliko milisekundi biti poslan.

Pokušajte i ovo

Window.onbeforeunload = function () ( if (pasteEditorChange) ( var btn = confirm("Želite li spremiti promjene?"); if(btn === true)( SavetoEdit();//vaš poziv funkcije ) else ( windowClose();//vaš poziv funkcije ) ) else ( windowClose();//vaš poziv funkcije ) );

Samo provjeri...

Funkcija wopen_close())( var w = window.open($url, "_blank", "width=600, height=400, trake za pomicanje=ne, status=ne, promjenjive veličine=ne, screenx=0, screeny=0") ; w.onunload = function() ( if (window.closed) ( alert("prozor zatvoren"); )else( alert("upravo osvježeno"); ) ) )

Nažalost, pokrenut će se događaj ponovnog učitavanja, preusmjeravanja nove stranice ili zatvaranja preglednika. Alternativa je uhvatiti ID koji pokreće događaj, i ako je obrazac, ne pozivati ​​nikakvu funkciju, a ako nije ID obrasca, onda učinite ono što želite kada se stranica zatvori. Nisam siguran je li to također moguće izravno i zamorno je.

Postoje neke sitnice koje možete učiniti prije nego što klijent zatvori karticu. javascript otkriva preglednik zatvori karticu/zatvori preglednik, ali ako je vaš popis radnji velik i kartica se zatvori prije nego što je dovršena, bespomoćni ste. Možete pokušati, ali prema mom iskustvu ne ovisi o tome.

Window.addEventListener("beforeunload", function (e) ( var confirmationMessage = "\o/"; /* Imate li mali akcijski kod ovdje */ (e || window.event).returnValue = confirmationMessage; //Gecko + IE povratna poruka potvrde; //Webkit, Safari, Chrome ));

Ako ih vaš prikaz obrasca šalje na drugu stranicu (što ja vjerujem da jest, tj. izvodi se beforeunload), možete pokušati promijeniti beforeunload obrasca u ajax poziv. Na taj način oni neće napustiti vašu stranicu kada je obrazac beforeunloaded, a vi možete koristiti svoje beforeunload vezanje kako želite.

Za rješenje koje je dobro funkcioniralo s kontrolama treće strane kao što su Telerik (kao što je RadComboBox) i DevExpress, koje koriste oznake sidra iz različitih razloga, razmotrite sljedeći kod, koji je malo poboljšana verzija desm koda s boljim selektorom za samu oznaku sidra vezanje:

Var inFormOrLink; $("a:not(), a").live("klik", funkcija() ( inFormOrLink = true; )); $("obrazac").bind("pošalji", funkcija() ( inFormOrLink = istina; )); $(window).bind("beforeunload", function(eventObject) ( var returnValue = undefined; if (! inFormOrLink) ( returnValue = "Želite li stvarno zatvoriti?"; } eventObject.returnValue = returnValue; return returnValue; });!}

Koristio sam Slaks, ali ne radi takav kakav je jer se onbeforeunload returnValue analizira kao niz i zatim prikazuje u prozoru za potvrdu preglednika. Ovako se prikazuje pravi, na primjer "istina".

Samo korištenje Povratne informacije. Evo mog koda

Var preventUnloadPrompt; var messageBeforeUnload = "moja poruka ovdje - Jeste li sigurni da želite napustiti ovu stranicu?"; //var redirectAfterPrompt = "http://www.google.co.in"; $("a").live("klik", funkcija() ( preventUnloadPrompt = true; )); $("forma").live("submit", function() ( preventUnloadPrompt = true; )); $(window).bind("beforeunload", function(e) ( var rval; if(preventUnloadPrompt) ( return; ) else ( //location.replace(redirectAfterPrompt); return messageBeforeUnload; ) return rval; ))

Var validNavigation = false; jQuery(dokument).spreman(funkcija () ( wireUpEvents(); )); funkcija endSession() ( // Preglednik ili kartica preglednika su zatvoreni // Učinite sth ovdje ... alert("bye"); ) funkcija wireUpEvents() ( /* * Za popis događaja koji pokreću onbeforeunload na IE * provjerite http ://msdn.microsoft.com/en-us/library/ms536907(VS.85).aspx */ window.onbeforeunload = function () (debugger if (!validNavigation) ( endSession(); ) ) // Priložite događaj tipke za isključivanje F5 refresh $(document).bind("keypress", function (e) (debugger if (e.keyCode == 116) ( validNavigation = true; ) )); // Priloži događaj klik za sve veze na stranici $("a").bind("klik", funkcija () ( program za ispravljanje pogrešaka validNavigation = true; )); // Priloži slanje događaja za sve obrasce na stranici $("forma").bind( "submit", function () (debugger validNavigation = true; )); // Priloži klik događaja za sve ulaze na stranici $("input").bind("click", function () (debugger validNavigation = true; )); )`unesite kod ovdje`

Moj problem: događaj "onbeforeunload" pokrenut će se samo ako je bilo neparnog broja podnošenja (klikova). Imao sam kombinaciju rješenja iz sličnih tema na SO-u da bi moje rješenje radilo. u redu, moj kod će govoriti.

$(document).ready(function() ( updatefgallowPrompt(true); window.onbeforeunload = WarnUser; ) function WarnUser() ( var allowPrompt = getfgallowPrompt(); if(allowPrompt) ( saveIndexedDataAlert(); return null; ) else ( updatefgallowPrompt(true); event.stopPropagation ) ) funkcija saveIndexedDataAlert() ( var allowPrompt = getfgallowPrompt(); var lenIndexedDocs = parseInt($("#sortable3 > li").size()) + parseInt($("#sortable3 > ul").size()); if(allowPrompt && $.trim(lenIndexedDocs) > 0) ( event.returnValue = "Vaša poruka"; } else { event.returnValue = " "; updatefgallowPrompt(true); } } $(document).click(function(event) { $("a").live("click", function() { updatefgallowPrompt(false); }); }); function updatefgallowPrompt (allowPrompt){ //exit msg dfds $("body").data("allowPrompt", allowPrompt); } function getfgallowPrompt(){ return $("body").data("allowPrompt"); }!}

Poslije je radio za mene;

$(prozor).unload(funkcija(event) ( if(event.clientY< 0) { //do whatever you want when closing the window.. } });

Window.onbeforeunload = function () ( return "Želite li stvarno zatvoriti?"; );

Možda samo rukovatelj događajima beforeunload u obrascu za rukovanje događajima slanja:

JQuery("forma").submit(function() ( jQuery(prozor).unbind("beforeunload"); ... ));

2

Imam jednu roditeljsku stranicu i podređenu stranicu. podređena stranica otvorena u novoj kartici

Želim prikazati jednu poruku upozorenja (podređena stranica se zatvara) kada zatvorim podređenu karticu.
Kako prikazati zatvorenu poruku pri zatvaranju kartice? (Nije vrijeme za osvježenje)

Koristio sam OnUnload i onbeforeunload.
Dvije se metode također pozivaju prilikom osvježavanja stranice i zatvaranja kartica.

Window.onunload = funkcija doUnload(e) ( alert("Podređeni prozor se zatvara..."); )

Window.onbeforeunload = funkcija doUnload(e) ( alert("Prozor djeteta se zatvara..."); )

Moram prikazati poruku upozorenja, samo zatvorite karticu u pregledniku.

Pomozi mi. Hvala unaprijed.

Koristim sljedeću skriptu. Radilo je u IE. Ali nije radio u FireFoxu

window.onbeforeunload = function() ( if ((window.event.clientX< 0) || (window.event.clientY < 0) || (window.event.clientX < -80)) { alert("Child window is closing..."); } };

Kako to postići u FireFoxu i drugim preglednicima.

  • 4 odgovora
  • Sortiranje:

    Aktivnost

1

Jer ovaj afaik nikada nije bio scenarij za više preglednika. Rješenje je da se NE oslanjate na nedokumentirane i promjenjive značajke specifične za preglednik da otkrijete bilo što važno.

Budući da imate CHILD stranicu, možete postaviti test na roditelju (otvoraču) koji provjerava svojstvo childWindowHandle.closed u intervalima i djeluje na to.

1

Pod pretpostavkom da samo pokušava pokrenuti događaj beforeunload Crossbrowser, ovo uglavnom to uspijeva (osim u Operi)

Try( // http://www.opera.com/support/kb/view/827/ opera.setOverrideHistoryNavigationMode("compatible"); history.navigationMode = "compatible"; )catch(e)() //Our Where Funkcija F" Ideš li poruka ReturnMessage() ( return "WTF!!!"; ) //UnBind Funkcija funkcija UnBindWindow() ( window.onbeforeunload = null; return true; ) //Bind Veze na koje ne želimo utjecati na dokument .getElementById("homebtn").onclick = UnBindWindow; document.getElementById("googlebtn").onclick = UnBindWindow; //Bind Exit Message Dialogue window.onbeforeunload = ReturnMessage;

0

Možda to nećete moći učiniti osim za neke metode temeljene na kolačićima, što je razvojno zaobilazno rješenje jer nije postojano kolačići. Druga identifikacija osvježavanja stranice, preusmjeravanja na temelju obrasca ili obrnutog preusmjeravanja ili zatvaranja preglednika s izbacivanjem događaja nije jednostavna i zamorna. Preporučam da ne ovisite o ovome.

možete učiniti neke sitnice prije nego što klijent zatvori karticu. javascript detektiraj preglednik zatvori karticu/zatvori preglednik , ali ako je tvoj popis radnji velik i kartica se zatvori prije nego što je dovršena, bespomoćni ste. Možete pokušati, ali prema mom iskustvu ne ovisi o tome. Da, u ovom trenutku ne možete razlikovati, ažurirati i zatvoriti. Stoga ne postoji pouzdan način da se kaže je li dijete doista zatvoreno.

Window.addEventListener("beforeunload", function (e) ( var confirmationMessage = "\o/"; /* Imate li mali akcijski kod ovdje */ (e || window.event).returnValue = confirmationMessage; //Gecko + IE povratna poruka potvrde; //Webkit, Safari, Chrome ));



js događaj ponovnog učitavanja stranice (14)

Želim snimiti događaj zatvaranja prozora preglednika/kartice. Pokušao sam sljedeće s jQueryjem:

JQuery(window).bind("beforeunload", function() ( return confirm("Želite li stvarno zatvoriti?") ))

Ali radi i s podnošenjem obrazaca, što nije ono što želim. Želim događaj koji se pokreće samo kada korisnik zatvori prozor.

Možda samo rukovatelj događajima beforeunload u obrascu za rukovanje događajima slanja:

JQuery("forma").submit(function() ( jQuery(prozor).unbind("beforeunload"); ... ));

Ako ih vaš prikaz obrasca šalje na drugu stranicu (što ja vjerujem da jest, tj. izvodi se beforeunload), možete pokušati promijeniti beforeunload obrasca u ajax poziv. Na taj način oni neće napustiti vašu stranicu kada je obrazac beforeunloaded, a vi možete koristiti svoje beforeunload vezanje kako želite.

Pokušajte i ovo

Window.onbeforeunload = function () ( if (pasteEditorChange) ( var btn = confirm("Želite li spremiti promjene?"); if(btn === true)( SavetoEdit();//vaš poziv funkcije ) else ( windowClose();//vaš poziv funkcije ) ) else ( windowClose();//vaš poziv funkcije ) );

Poslije je radio za mene;

$(prozor).unload(funkcija(event) ( if(event.clientY< 0) { //do whatever you want when closing the window.. } });

Koristio sam Slaks, ali ne radi takav kakav je jer se onbeforeunload returnValue analizira kao niz i zatim prikazuje u prozoru za potvrdu preglednika. Ovako se prikazuje vrijednost true, na primjer "true".

Samo pomoću povratnih informacija. Evo mog koda

Var preventUnloadPrompt; var messageBeforeUnload = "moja poruka ovdje - Jeste li sigurni da želite napustiti ovu stranicu?"; //var redirectAfterPrompt = "http://www.google.co.in"; $("a").live("klik", funkcija() ( preventUnloadPrompt = true; )); $("forma").live("submit", function() ( preventUnloadPrompt = true; )); $(window).bind("beforeunload", function(e) ( var rval; if(preventUnloadPrompt) ( return; ) else ( //location.replace(redirectAfterPrompt); return messageBeforeUnload; ) return rval; ))

Var validNavigation = false; jQuery(dokument).spreman(funkcija () ( wireUpEvents(); )); funkcija endSession() ( // Preglednik ili kartica preglednika su zatvoreni // Učinite sth ovdje ... alert("bye"); ) funkcija wireUpEvents() ( /* * Za popis događaja koji pokreću onbeforeunload na IE * provjerite http ://msdn.microsoft.com/en-us/library/ms536907(VS.85).aspx */ window.onbeforeunload = function () (debugger if (!validNavigation) ( endSession(); ) ) // Priložite događaj tipke za isključivanje F5 refresh $(document).bind("keypress", function (e) (debugger if (e.keyCode == 116) ( validNavigation = true; ) )); // Priloži događaj klik za sve veze na stranici $("a").bind("klik", funkcija () ( program za ispravljanje pogrešaka validNavigation = true; )); // Priloži slanje događaja za sve obrasce na stranici $("forma").bind( "submit", function () (debugger validNavigation = true; )); // Priloži klik događaja za sve ulaze na stranici $("input").bind("click", function () (debugger validNavigation = true; )); )`unesite kod ovdje`

Možda možete rukovati OnSubmit i postaviti oznaku koju ćete kasnije provjeriti u OnBeforeUnload rukovatelju.

JQuery(window).bind("beforeunload", function (e) ( var activeElementTagName = e.target.activeElement.tagName; if (activeElementTagName != "A" && activeElementTagName != "INPUT") ( return "Da li stvarno želite zatvoriti?"; ) ))

Za rješenje koje je dobro funkcioniralo s kontrolama treće strane kao što su Telerik (kao što je RadComboBox) i DevExpress, koje koriste oznake sidra iz različitih razloga, razmotrite sljedeći kod, koji je malo poboljšana verzija desm koda s boljim selektorom za samu oznaku sidra vezanje:

Var inFormOrLink; $("a:not(), a").live("klik", funkcija() ( inFormOrLink = true; )); $("obrazac").bind("pošalji", funkcija() ( inFormOrLink = istina; )); $(window).bind("beforeunload", function(eventObject) ( var returnValue = undefined; if (! inFormOrLink) ( returnValue = "Želite li stvarno zatvoriti?"; } eventObject.returnValue = returnValue; return returnValue; });!}

Moj odgovor je usmjeren na pružanje jednostavnih testova.

KAKO

Vidi @SLaks odgovor.

$(window).on("beforeunload", function() ( return inFormOrLink ? "Želite li stvarno zatvoriti?" : null; ))

Koliko će trebati pregledniku da konačno zatvori stranicu?

Kad god korisnik zatvori stranicu (gumb x ili CTRL + W), preglednik izvršava ovaj kod prije beforeunload , ali ne beskonačno. Jedina iznimka je prozor za potvrdu (povratak "Želite li stvarno zatvoriti?"), koji će čekati odgovor korisnika.

Chrome: 2 sekunde.
Firefox: ∞ (ili dvaput kliknite ili prisilno zatvorite)
Rub: ∞ (ili dvostruki klik)
Explorer 11: 0 sekundi.
Safari: NAPRAVITI

Što smo koristili za ovo testiranje:

  • Node.js Express poslužitelj s zapisnikom zahtjeva
  • Sljedeća kratka HTML datoteka

Ono što radi je slanje što više zahtjeva prije nego što preglednik završi svoju stranicu (sinkrono).

function request() ( return $.ajax(( tip: "GET", url: "http://localhost:3030/" + Date.now(), async: true )).responseText; ) window.onbeforeunload = ( ) => ( while (true) ( ​​​​request(); ) return null; )

Chrome izlaz:

GET /1480451321041 404 0,389 ms - 32 GET /1480451321052 404 0,219 ms - 32 ... GET /hello/1480451322998 404 0,328 ms - 32 1957ms ≈ 2 sekunde // pretpostavljamo da su 2 sekunde jer za zahtjeve može biti potrebno nekoliko milisekundi biti poslan.

Za rješenje za više preglednika (testirano u Chromeu 21, IE9, FF15), razmotrite sljedeći kod, koji je malo modificirana verzija Slaks koda:

Var inFormOrLink; $("a").live("klik", funkcija() ( inFormOrLink = istina; )); $("obrazac").bind("pošalji", funkcija() ( inFormOrLink = istina; )); $(window).bind("beforeunload", function(eventObject) ( var returnValue = undefined; if (! inFormOrLink) ( returnValue = "Želite li stvarno zatvoriti?"; } eventObject.returnValue = returnValue; return returnValue; }); !}

Imajte na umu da se u Firefoxu 4 pojavljuje poruka "Jeste li sigurni da želite zatvoriti?". nije prikazano. FF jednostavno prikazuje opću poruku. Pogledajte bilješku na https://developer.mozilla.org/en-US/docs/DOM/window.onbeforeunload

Događaj beforeunload aktivira se kad god korisnik napusti vašu stranicu iz bilo kojeg razloga.

Na primjer, pokrenut će se ako korisnik pošalje obrazac, klikne vezu, zatvori prozor (ili karticu) ili prijeđe na nova stranica pomoću adresne trake, okvira za pretraživanje ili oznake.

Var inFormOrLink; $("a").on("klik", funkcija() ( inFormOrLink = istina; )); $("forma").on("pošalji", funkcija() ( inFormOrLink = istina; )); $(window).on("beforeunload", function() ( return inFormOrLink ? "Želite li stvarno zatvoriti?" : null; ))

Za verzije jQueryja starije od 1.7 pokušajte ovo:

Var inFormOrLink; $("a").live("klik", funkcija() ( inFormOrLink = istina; )); $("obrazac").bind("pošalji", funkcija() ( inFormOrLink = istina; )); $(window).bind("beforeunload", function() ( return inFormOrLink ? "Želite li stvarno zatvoriti?" : null; ))

live metoda ne radi s događajem slanja, pa ako dodate nova uniforma, također ćete morati vezati rukovatelja za njega.

Imajte na umu da ako drugi rukovatelj događajima otkaže podnošenje ili navigaciju, izgubit ćete upit za potvrdu ako se prozor kasnije zaista zatvori. To možete popraviti tako da bilježite vrijeme u događajima slanja i klikanja i provjeravate je li do unloada potrebno više od nekoliko sekundi.

Samo provjeri...

Funkcija wopen_close())( var w = window.open($url, "_blank", "width=600, height=400, trake za pomicanje=ne, status=ne, promjenjive veličine=ne, screenx=0, screeny=0") ; w.onunload = function() ( if (window.closed) ( alert("prozor zatvoren"); )else( alert("upravo osvježeno"); ) ) )

Od jQuery 1.7, metoda .live() je zastarjela. Koristite .on() za prilaganje rukovatelja događajima. Korisnici starijih verzija jQueryja trebali bi koristiti .delegate() umjesto .live()

$(window).bind("beforeunload", function() ( return true || confirm("Želite li stvarno zatvoriti?"); ));

Dobar dan. Nedavno sam objavio članak o tome kako to učiniti, ali mnogi su tražili da se doda članak s efektom ogledala, kako bi se prozor pojavio kada posjetitelj napusti stranicu, odnosno kada pokuša zatvoriti stranicu.

Danas ćemo razgovarati o ovoj temi, a ja ću vam pokazati jednostavnu implementaciju.

Naravno, rasprava o tome trebate li ili ne dodati skočni prozor za zatvaranje na svoju stranicu nikada neće prestati. Neki kažu da postoji posebno mjesto u paklu rezervirano za one koji to dodaju, da je to strašno bijesno, da ako sam odlučio otići, onda ću otići i nikakvi iskačući prozori me neće spriječiti, već će me samo živcirati. Drugi kažu da ovi skočni prozori povećavaju broj pretvorbi i rade izvrsno. Mislim da vrijedi pokušati, a zatim na temelju statistike izvući konkretne zaključke u vezi s vašom nišom i proizvodom.

Kako napraviti skočni prozor pri zatvaranju stranice

Zapravo, nisam se više trudio i samo sam malo promijenio prethodni članak i dodao nekoliko redaka javascript koda. Prethodno se modalni prozor pojavljivao kada ste prvi put posjetili web mjesto. Sada će se prikazati samo pri prvom posjetu web mjestu (kada kursor napusti glavno područje web mjesta i prijeđe na područje kartica). Ako korisnik ponovno posjeti stranicu, ovaj prozor neće biti prikazan. Ovo se provodi na točno isti način kao u prethodnom članku, pomoću kolačića. Kolačići se čuvaju 7 dana, možete odrediti bilo koju količinu po vlastitom nahođenju.

Pa ipak, kliku na križić u kartici ne pridružujemo događaj, već jednostavno provjeravamo položaj pokazivača. Ne blokiramo prozor, gumbe itd., ne zahtijevamo ništa, već jednostavno pokažemo prozor.

Kao i prošli put, koristit ćemo jQuery dodatak arcticModal, što znači da ćemo spojiti sam jQuery:

I povezujemo temu dodatka, ja koristim standardnu, ali možete napisati svoju:

Sada ćemo, kako bi naši kolačići radili, dodati dodatak za kolačiće s Yandexa:

I povežite skriptu config.js sa sljedećim sadržajem:

$(document).ready(function () ( if (!$.cookie("smartCookies")) ( $(document).mouseleave(function (e) ( function getWindow() ( $(".offer").arcticmodal (( closeOnOverlayClick: true, closeOnEsc: true )); setTimeout(getWindow, 1); $.cookie("smartCookies", true, ( ističe: 7, put: "/" )); )); ); ) );

Ako ste pročitali prošli članak, primijetili ste da se ništa nije promijenilo, osim što se malo promijenila skripta u datoteci config.js. Odnosno, jednostavno se pojavio još jedan uvjet koji se aktivira kada pokazivač napusti područje stranice, odnosno nalazi se u području kartica.

Usput, prošli put sam zaboravio objasniti što znače ovi parametri:

CloseOnOverlayClick: true, closeOnEsc: true

  • closeOnOverlayClick - omogućuje zatvaranje prozora kada kliknete bilo koje područje izvan prozora.
  • closeOnEsc - zatvara prozor kada pritisnete Escape

Sada o samom izgledu stranice. Apsolutno se ništa nije promijenilo.

Vaš prijedlog, formular itd. bit će ovdje. Možete umetnuti obrazac ili ponuditi da vas prate na društvenim mrežama

Pojasnit ću malo. modalInner — omot modalni prozor, s display:none u stilovima. ponuda je klasa samog modalnog prozora. Ako ga promijenite, ne zaboravite promijeniti klasu u skripti.

Ovdje je jednostavna implementacija skočnog prozora prilikom zatvaranja stranice. Mislite li da se isplati koristiti sličan učinak na web stranici?

“onbeforeunload događaj ne prikazuje tekst dostavljen sa stranice, samo standardnu ​​poruku”, sudeći po komentarima, konačno i neopozivo. U tom smislu, htio sam napisati nešto o povijesti problema.

Mnogi ljudi znaju da zahvaljujući onbeforeunloadu možete zamoliti korisnika da ne napušta web stranicu ako ima nespremljene podatke (na primjer, napisane u obrascu, ali nisu poslane poruke na forum). Da biste to učinili, samo dodajte nešto poput ovog JavaScript-a:
window.onbeforeunload = function (evt) ( var message = "Dokument "foo" nije spremljen. Izgubit ćete promjene ako napustite stranicu."; if (typeof evt == "undefined") ( evt = window.event ; ) if (evt) ( evt.returnValue = message; ) povratna poruka; )
Nakon toga, idealno, ako korisnik želi napustiti stranicu (na bilo koji način - zatvoriti karticu, zatvoriti cijeli preglednik, ponovno učitati stranicu, upisati nova adresa V adresna traka, idite na knjižnu oznaku itd.), vidjet će zahtjev za potvrdu i napuštanje stranice može se otkazati. Prethodno su beskrupulozni autori web stranica pokušali upotrijebiti ovaj prozor kako bi nadmudrili korisnika i zadržali ga na stranici, na primjer, koristeći tekst "Kliknite U redu za nastavak rada sa web mjestom i Odustani za zatvaranje" (zapravo, gumbi su radili drugi skroz okolo). Ili čak nešto strašnije poput "Kliknite OK da potvrdite terećenje vaše kreditne kartice od 1000 USD."

Zatim su preglednici postali mudriji i počeli dodavati pomoćni tekst kako bi bilo teže prevariti korisnika. Na primjer, evo kako to radi IE8:

Gotovo sličan tekst bio je u Firefoxu 3:


Ako sve pročitate, postaje jasno što je objavila stranica, a što preglednik. Međutim, još uvijek možete varati.


Ovdje vidimo jasan opis radnji izravno na gumbima. Već je prilično teško uvjeriti korisnika da klikne “Odustani” da ostane i “Ostani” da ode. Po meni je rješenje idealno i ova tema se može zatvoriti. Općenito, kao što znate, OK bez lica u gotovo svakom dijaloškom okviru treba zamijeniti nazivom radnje (na primjer, "Izbriši datoteke", "Traži", "Dodaj redak", "Otvori datoteku" itd.), ovo smanjuje broj korisničkih pogrešaka, čak i ako imate potpunu kontrolu nad tekstom dijaloga.

Kakva je bila drama s greškom 641509? Činjenica je da ova potvrda u Firefoxu 4 i novijim verzijama izgleda ovako:


Kao što se vidi, prilagođeni tekst potpuno nestao. Od verzije 4, web stranica ne može dati nikakvu dodatnu poruku korisniku niti objasniti zašto konkretno ne želi da korisnik ode. Recimo, ako implementirate sučelje za rad s mnogo dokumenata u jednom prozoru, a jedan od njih nije spremljen, mogli biste reći koji konkretno, ali u Firefoxu to nećete razumjeti. Možda je ne želite spremiti i da ste vidjeli poruku, mirno biste napustili stranicu, ali inače ne znate što se događa. U listu