Javascript poruka prije zatvaranja prozora. JavaScript - Window Object: Otvaranje i zatvaranje prozora. Što smo koristili da ovo testiramo?

Već su me nekoliko puta pitali kako postupiti sa zatvaranjem kartice. Recimo da korisnik želi zatvoriti vašu stranicu, a vi napravite neku vrstu skočnog prozora i pitate: " Jesi li siguran?", ili preusmjeriti na drugu stranicu. Naravno, te su metode vrlo neugodne za korisnike, stoga preporučujem da ih ne koristite. Srećom, preglednici se također vrlo loše nose s tim, međutim, još uvijek postoje neke opcije za rukovanje zatvaranjem kartica.

Moguće je pitati korisnika: " Je li siguran da želi zatvoriti stranicu?". Evo kako možete implementirati ovu obradu zatvaranja kartice:


window.onbeforeunload = funkcija() (
return "Nešto za reći korisniku";
}

Ovaj kod će raditi u Firefoxu, IE, Chromeu, ali neće raditi u Operi (ovaj preglednik uopće ne obrađuje onbeforeunload). U ovom slučaju, sama funkcija obrade može vratiti samo niz, odnosno nikakva preusmjeravanja tamo neće raditi.

Vraćeni niz bit će prikazan u prozoru za potvrdu u pregledniku Chrome i IE. Ovaj redak se ne pojavljuje u Firefoxu.

“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; ) return message;
Nakon toga, idealno, ako korisnik želi napustiti stranicu (na bilo koji način - zatvoriti karticu, zatvoriti cijeli preglednik, ponovno učitati stranicu, unijeti novu adresu u adresnu traku, otići na 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 vidite, prilagođeni tekst je 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

U ovoj lekciji naučit ćemo o različitim metodama objekta prozora, koje vam omogućuju otvaranje i zatvaranje prozora, utvrđivanje je li prozor zatvoren, te dobivanje njegovog internog imena itd.

Metode objekta prozora su open() , close() , print() , focus() i blur() .

U ovom odjeljku ćemo pogledati sljedeće metode objekta prozora:

  • open() - dizajniran za otvaranje prozora (kartica);
  • close() - dizajniran za zatvaranje prozora. Uglavnom se koristi za zatvaranje prozora otvorenih metodom open();
  • print() - dizajniran za ispis sadržaja prozora;
  • focus() - dizajniran za prijenos fokusa na navedeni prozor;
  • blur() - dizajniran je za uklanjanje fokusa s navedenog prozora.
metoda open(). Dizajniran je za otvaranje novog prozora (kartice) u pregledniku i ima sljedeću sintaksu:

Parametri metode:

  • Prvi parametar specificira URL stranice koju je potrebno učitati u ovaj prozor. Ako vrijednost ovog parametra nije navedena, u prozoru će biti prikazana prazna stranica (about:blank).
  • Drugi parametar metode open specificira vrijednost ciljnog atributa ili naziv prozora. Podržane su sljedeće vrijednosti:
    • _blank - URL se učitava u novi prozor (tab). Ovo je zadana vrijednost;
    • _parent - URL se učitava u nadređeni okvir. Ako ga nema, tada se URL učitava u trenutni prozor (tab);
    • _self - URL se učitava u trenutni prozor;
    • _top - poništava sve okvire i učitava URL u trenutni prozor preglednika (tab). Ako ga nema, tada se URL učitava u trenutni prozor (tab);
    • Također možete navesti naziv prozora koji će se otvoriti kao parametar. Ovo je ime interno i web programeri ga mogu koristiti za pozivanje funkcija i metoda ovog prozora.
  • Treći parametar je namijenjen za određivanje skupa svojstava prozora, koja se unose odvojena zarezima. Podržana su sljedeća osnovna svojstva prozora:
    • lijevo , gore - koordinate (u pikselima) gornjeg lijevog kuta prozora preglednika u odnosu na gornji lijevi kut zaslona. Vrijednosti ovih svojstava moraju biti pozitivne ili jednake 0;
    • visina , širina - visina i širina radnog područja prozora preglednika. Pri određivanju vrijednosti potrebno je voditi računa da širina i visina prozora preglednika ne mogu biti manje od 100 piksela;
    • resizable je Booleovo svojstvo prozora koje je dizajnirano da omogući ili onemogući mogućnost promjene veličine prozora preglednika. Ovo svojstvo prihvaća sljedeće vrijednosti: da ili 1 i ne ili 0;
    • scrollbars je Booleovo svojstvo prozora koje se koristi za omogućavanje ili onemogućavanje prikaza kliznih traka za sadržaj prozora preglednika. Ovo svojstvo prihvaća sljedeće vrijednosti: da ili 1 i ne ili 0;
    • status je logično svojstvo prozora koje je namijenjeno za omogućavanje ili onemogućavanje prikaza statusne trake preglednika. Ovo svojstvo prihvaća sljedeće vrijednosti: da ili 1 i ne ili 0.

Razmotrite sljedeće primjere:

1. Otvorite praznu about:blank stranicu u novom prozoru. Ovaj prozor bi trebao imati širinu i visinu od 250px:

Window.open("","","width=250,height=250");

2. Otvorite web stranicu "http://site/" u trenutnom prozoru:

Window.open("http://site/", "_self");

3. Otvorite novi prozor s određenim svojstvima (vrh=100, lijevo=100, širina=400, visina=500, trake za pomicanje=da, resizabie=da):

Window.open("http://site", "_blank", "vrh=100, lijevo=100, širina=400, visina=500, trake za pomicanje=da, promjenjiva veličina=da");

Kako komunicirati s prozorom nakon što je otvoren?

Metoda open() omogućuje ne samo otvaranje prozora, već i dobivanje poveznice na ovaj prozor. Ova vam veza omogućuje interakciju s ovim prozorom pozivanjem određenih svojstava i metoda. Oni. Možemo koristiti JavaScript kod koji se nalazi u jednom prozoru za kontrolu drugog prozora.

Na primjer, za pristup objektu dokumenta otvorenog prozora:

Otvorite prazan novi prozor i prikažite tekst u njemu:

Var myWindow = window.open("", "", "width=250, height=250"); myWindow.document.write("

Neki tekst

");

Napomena: Možete komunicirati samo s prozorima koje ste otvorili;

metoda close().

Dizajniran je za zatvaranje prozora. Ova metoda nema parametara. Obično se koristi za zatvaranje prozora stvorenih metodom open(). U suprotnom, kada pokušate zatvoriti prozor (tab) koji je otvorio sam korisnik (ne iz JavaScripta), preglednik će iz sigurnosnih razloga tražiti od korisnika potvrdu za izvođenje ove radnje.

Na primjer, stvorimo gumbe za otvaranje i zatvaranje prozora pod nazivom myWindow:

//kreiramo varijablu u koju ćemo pohraniti referencu na objekt prozora otvorenog prozora var myWindow; funkcija myWindowOpen ( myWindow = window.open("http://www.yandex.ru", “myWindow", "width=250, height=250"); ) funkcija myWindowClose ( if (myWindow) ( myWindow.close() ; myWindow = null; ) ) Otvori prozor Zatvori prozor

print() metoda

Dizajniran je za ispis sadržaja prozora. Ova metoda nema parametara.

funkcija myPrint() ( window.print(); ) Ispis stranice

metoda fokus().

Dizajniran je da stavi fokus na navedeni prozor. Ova metoda nema parametara.

metoda blur().

Namijenjen je uklanjanju fokusa s određenog prozora, tj. pomiče u pozadinu. Ova metoda nema parametara.

funkcija myWindowOpen() ( var myWindow = window.open("", "", "width=200,height=100"); ) funkcija myWindowFocus() ( myWindow.focus(); ) funkcija myWindowBlur() ( myWindow.blur (; ) Otvori prozor Stavi fokus na prozor Premjesti prozor u pozadinu

Svojstva objekta prozora: ime, otvarač, zatvoreno.

U ovom ćemo odjeljku pogledati sljedeća svojstva objekta prozora:

  • ime - namijenjeno je dobivanju ili postavljanju internog imena prozora;
  • otvarač - omogućuje vam da u trenutnom prozoru dobijete vezu na prozor (objekt prozora) iz kojeg je ovaj prozor otvoren;
  • closed je booleovo svojstvo koje vraća: true ako je prozor zatvoren i false ako je prozor otvoren.
ime imovine

Ovo se svojstvo vrlo često koristi za promjenu internog imena prozora nakon što je već otvoren. Osim toga, svojstvo name može vratiti trenutnu vrijednost internog naziva prozora.

Unutarnje ime prozora nije string zatvoren između uvodne i završne oznake naslova - to je naziv prozora koji je namijenjen programeru. Oni. ovo ime je nevidljivo korisniku.

Ovaj se naziv prvenstveno koristi u hipervezama i obrascima za označavanje prozora u kojem se stranica treba otvoriti. Na primjer, za označavanje internog naziva prozora u hipervezi koristi se atribut target. Ako element a ima atribut target="searchWindow", tada kada kliknete na ovu vezu, preglednik prvo pokušava pronaći prozor s. takav interni naziv (searchWindow), ako ne postoje prozori s takvim internim imenom, otvara novi prozor i naziva ga searchWindow. A ako prozor s istim nazivom postoji, tada se novi prozor ne otvara, ali se stranica ponovno učitava pomoću navedene veze u ovom prozoru. Prema zadanim postavkama, prozori preglednika nemaju interni naziv.

Na primjer, otvorimo stranicu "http://www.google.com/" u prozoru pod nazivom myWindow:

window.name = "myWindow";

Na primjer, otvorimo prozor pomoću metode open() i u njemu prikažemo njegovo ime:

var wnd = window.open("","myTest","width=200, height=300"); wnd.document.write("

Ovaj prozor ima naziv: " + wnd.name + ".");

otvarač imovine

Ovo svojstvo vam omogućuje da u prozoru dobijete vezu na izvorni prozor (objekt prozora), tj. do prozora s kojeg je prozor otvoren.

Na primjer, imate izvorni prozor (1), u kojem koristite metodu open() za otvaranje drugog prozora (2). U ovom prozoru (2) možete koristiti svojstvo otvarača da dobijete prozor (1).

funkcija openMyWindow() ( var myWindow=window.open("","","width=200,height=200"); myWindow.document.write("Otvori prozor (2)"); $(document).ready (function() ( updatefgallowPrompt(true); window.onbeforeunload = WarnUser; ) function WarnUser() ( var allowPrompt = getfgallowPrompt(); if(allowPrompt) ( saveIndexedDataAlert(); return null; ) else ( updatefgallowPrompt(true); događaj .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.onbeforeunload = ReturnMessage;

0

Možda to nećete moći učiniti osim za neke metode temeljene na kolačićima, što je rad na razvoju zaobilaznih rješenja kao nepostojani 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čite 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 return confirmationMessage; //Webkit, Safari, Chrome ));