Sporočilo Javascript, preden zaprete okno. JavaScript - Window Object: odpiranje in zapiranje oken. Kaj smo uporabili za to testiranje?

Večkrat so me že vprašali, kako ravnati z zapiranjem zavihka. Recimo, da uporabnik želi zapreti vaše spletno mesto, vi pa odprete nekakšno pojavno okno in vprašate: " Ali si prepričan?", ali preusmeritev na drugo spletno stran. Seveda so te metode zelo moteče za uporabnike, zato priporočam, da jih ne uporabljate. K sreči brskalniki tudi to zelo slabo prenašajo, kljub temu pa obstaja nekaj možnosti za ravnanje z zapiranjem zavihkov.

Uporabnika je mogoče vprašati: " Ali je prepričan, da želi zapreti stran?". Tukaj je opisano, kako lahko implementirate to obdelavo zapiranja zavihkov:


window.onbeforeunload = funkcija() (
vrni "Nekaj ​​za povedati uporabniku";
}

Ta koda bo delovala v Firefoxu, IE, Chromu, ne bo pa delovala v Operi (ta brskalnik sploh ne obdeluje onbeforeunload). V tem primeru lahko sama funkcija obdelave vrne samo niz, kar pomeni, da tam nobena preusmeritev ne bo delovala.

Vrnjeni niz bo prikazan v potrditvenem oknu v Chromu in IE. Ta vrstica se ne prikaže v Firefoxu.

»dogodek onbeforeunload ne prikaže besedila, ki ga posreduje spletno mesto, ampak samo standardno sporočilo«, sodeč po komentarjih, dokončno in nepreklicno. V zvezi s tem sem želel napisati nekaj o zgodovini vprašanja.

Mnogi vedo, da lahko zahvaljujoč onbeforeunload uporabnika prosite, naj ne zapusti spletne strani, če ima neshranjene podatke (na primer zapisan v obrazcu, vendar ni poslal sporočila na forum). Če želite to narediti, preprosto dodajte nekaj podobnega temu JavaScript:
window.onbeforeunload = funkcija (evt) ( var message = "Dokument "foo" ni shranjen. Če zapustite stran, boste izgubili spremembe."; if (typeof evt == "undefined") ( evt = window.event ; ) if (evt) ( evt.returnValue = message; ) povratno sporočilo; )
Po tem, v idealnem primeru, če želi uporabnik zapustiti stran (na kakršen koli način - zapreti zavihek, zapreti celoten brskalnik, znova naložiti stran, vnesti nov naslov v naslovno vrstico, iti na zaznamek itd.), bo videl zahtevo za potrditev in zapustitev strani bo lahko preklicana. Prej so brezvestni avtorji spletnih mest poskušali uporabiti to okno, da bi prelisičili uporabnika in ga obdržali na strani, na primer z besedilom »Kliknite V redu, da nadaljujete z delom s spletnim mestom, in Prekliči, da ga zaprete« (pravzaprav so gumbi delovali drugače naokoli). Ali celo kaj bolj strašnega, kot je "Kliknite V redu, da potrdite bremenitev vaše kreditne kartice v višini 1000 USD."

Nato so brskalniki postali modrejši in začeli dodajati pomožno besedilo, da bi bilo težje zavajati uporabnika. Tukaj je na primer, kako to počne IE8:

Skoraj podobno besedilo je bilo v Firefoxu 3:


Če preberete vse, postane jasno, kaj je poročalo spletno mesto in kaj brskalnik. Vendar pa lahko še vedno goljufate.


Tukaj vidimo jasen opis dejanj neposredno na gumbih. Uporabnika je že kar težko prepričati, da klikne »Odhod«, da ostane, in »Ostani«, da odide. Po mojem mnenju je rešitev idealna in to temo lahko zaključimo. Na splošno, kot veste, je treba brezlični OK v skoraj vsakem pogovornem oknu zamenjati z imenom dejanja (na primer »Izbriši datoteke«, »Išči«, »Dodaj vrstico«, »Odpri datoteko« itd.), to zmanjša število uporabniških napak, tudi če imate popoln nadzor nad besedilom dialoga.

Kakšna je bila drama s hroščem 641509? Dejstvo je, da je ta potrditev v Firefoxu 4 in novejših videti takole:


Kot lahko vidite, je besedilo po meri v celoti izginilo. Od različice 4 naprej spletno mesto ne more zagotoviti nobenega dodatnega sporočila uporabniku ali pojasniti, zakaj točno ne želi, da uporabnik zapusti spletno mesto. Recimo, če implementirate vmesnik za delo s številnimi dokumenti v enem oknu in eden od njih ni shranjen, bi lahko ugotovili, kateri posebej, vendar v Firefoxu tega ne boste razumeli. Morda ga ne želite shraniti in če bi videli sporočilo, bi stran mirno zapustili, sicer pa ne veste, kaj se dogaja. V listu

V tej lekciji se bomo seznanili z različnimi metodami okenskega objekta, ki vam omogočajo odpiranje in zapiranje oken, ugotavljanje, ali je okno zaprto, in tudi pridobivanje njegovega notranjega imena itd.

Metode objekta okna so open(), close(), print(), focus() in blur().

V tem razdelku si bomo ogledali naslednje metode okenskega objekta:

  • open() - zasnovan za odpiranje oken (zavihkov);
  • close() - zasnovan za zapiranje oken. Uporablja se predvsem za zapiranje oken, odprtih z metodo open();
  • print() - zasnovan za tiskanje vsebine okna;
  • focus() - zasnovan za prenos fokusa na določeno okno;
  • blur() - je namenjen odstranitvi fokusa iz določenega okna.
metoda open(). Namenjen je odpiranju novega okna (zavihka) v brskalniku in ima naslednjo sintakso:

Parametri metode:

  • Prvi parameter določa URL strani, ki jo je treba naložiti v to okno. Če vrednost tega parametra ni določena, bo v oknu prikazana prazna stran (about:blank).
  • Drugi parameter odprte metode določa vrednost ciljnega atributa ali ime okna. Podprte so naslednje vrednosti:
    • _blank – URL se naloži v novo okno (zavihek). To je privzeta vrednost;
    • _parent – ​​URL je naložen v nadrejeni okvir. Če ga ni, se URL naloži v trenutno okno (zavihek);
    • _self - URL se naloži v trenutno okno;
    • _top - prekliče vse okvirje in naloži URL v trenutno okno brskalnika (zavihek). Če ga ni, se URL naloži v trenutno okno (zavihek);
    • Kot parameter lahko določite tudi ime okna, ki ga želite odpreti. To ime je interno in ga lahko spletni razvijalci uporabljajo za klicanje funkcij in metod tega okna.
  • Tretji parameter je namenjen podajanju niza lastnosti okna, ki se vnesejo ločeno z vejicami. Podprte so naslednje osnovne lastnosti oken:
    • levo , zgoraj - koordinate (v slikovnih pikah) zgornjega levega kota okna brskalnika glede na zgornji levi kot zaslona. Vrednosti teh lastnosti morajo biti pozitivne ali enake 0;
    • višina , širina - višina in širina delovnega območja okna brskalnika. Pri določanju vrednosti je treba upoštevati, da širina in višina okna brskalnika ne smeta biti manjši od 100 slikovnih pik;
    • resizable je logična lastnost okna, ki je namenjena omogočanju ali onemogočanju možnosti spreminjanja velikosti okna brskalnika. Ta lastnost sprejema naslednje vrednosti: da ali 1 in ne ali 0;
    • scrollbars je logična lastnost okna, ki se uporablja za omogočanje ali onemogočanje prikaza drsnih trakov za vsebino okna brskalnika. Ta lastnost sprejema naslednje vrednosti: da ali 1 in ne ali 0;
    • status je logična lastnost okna, ki je namenjena omogočanju ali onemogočanju prikaza statusne vrstice brskalnika. Ta lastnost sprejema naslednje vrednosti: da ali 1 in ne ali 0.

Razmislite o naslednjih primerih:

1. Odprite prazno stran about:blank v novem oknu. To okno mora imeti širino in višino 250 slikovnih pik:

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

2. Odprite spletno stran "http://site/" v trenutnem oknu:

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

3. Odprite novo okno z določenimi lastnostmi (zgoraj=100, levo=100, širina=400, višina=500, drsni trakovi=da, resizabie=da):

Window.open("http://site", "_blank", "zgoraj=100, levo=100, širina=400, višina=500, drsni trakovi=da, možnost spreminjanja velikosti=da");

Kako komunicirati z oknom, potem ko je odprto?

Metoda open() vam omogoča ne le odpiranje okna, ampak tudi pridobitev povezave do tega okna. Ta povezava vam omogoča interakcijo s tem oknom s klicanjem določenih lastnosti in metod. Tisti. Za nadzor drugega okna lahko uporabimo kodo JavaScript, ki se nahaja v enem oknu.

Na primer, za dostop do predmeta dokumenta odprtega okna:

Odprite prazno novo okno in prikažite nekaj besedila v njem:

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

Nekaj ​​besedila

");

Opomba: komunicirate lahko samo z okni, ki ste jih odprli; z drugimi okni ne morete delati.

metoda close().

Namenjen je zapiranju okna. Ta metoda nima parametrov. Običajno se uporablja za zapiranje oken, ustvarjenih z metodo open(). V nasprotnem primeru, ko poskušate zapreti okno (zavihek), ki ga je odprl uporabnik sam (ne iz JavaScripta), bo brskalnik iz varnostnih razlogov od uporabnika zahteval potrditev za izvedbo tega dejanja.

Na primer, ustvarimo gumbe za odpiranje in zapiranje okna z imenom myWindow:

//ustvarimo spremenljivko, v katero bomo shranili sklic na objekt okna odprtega okna var myWindow; funkcija myWindowOpen ( myWindow = window.open("http://www.yandex.ru", “myWindow", "width=250, height=250"); ) funkcija myWindowClose ( if (myWindow) ( myWindow.close() ; myWindow = null; ) ) Odpri okno Zapri okno

metoda print().

Zasnovan je za tiskanje vsebine okna. Ta metoda nima parametrov.

funkcija myPrint() ( window.print(); ) Natisnite stran

metoda focus().

Zasnovan je tako, da daje fokus določenemu oknu. Ta metoda nima parametrov.

metoda blur().

Namenjen je odstranitvi fokusa iz določenega okna, tj. premakne v ozadje. Ta metoda nima parametrov.

funkcija myWindowOpen() ( var myWindow = window.open("", "", "width=200,height=100"); ) funkcija myWindowFocus() ( myWindow.focus(); ) funkcija myWindowBlur() ( myWindow.blur (; ) Odpri okno Osredotoči okno Premakni okno v ozadje

Lastnosti okenskega predmeta: ime, odpirač, zaprto.

V tem razdelku si bomo ogledali naslednje lastnosti okenskega objekta:

  • ime - je namenjeno pridobitvi ali nastavitvi notranjega imena okna;
  • odpirač - omogoča, da v trenutnem oknu dobite povezavo do okna (okenskega predmeta), iz katerega je bilo to okno odprto;
  • Closed je logična lastnost, ki vrne: true, če je okno zaprto, in false, če je okno odprto.
lastnost imena

Ta lastnost se zelo pogosto uporablja za spreminjanje notranjega imena okna, ko je že odprto. Poleg tega lahko lastnost name vrne trenutno vrednost notranjega imena okna.

Notranje ime okna ni niz, zaprt med začetno in končno naslovno oznako - je ime okna, ki je namenjeno razvijalcu. Tisti. to ime je uporabniku nevidno.

To ime se uporablja predvsem v hiperpovezavah in obrazcih za označevanje okna, v katerem naj se odpre stran. Na primer, za označevanje notranjega imena okna v hiperpovezavi se uporabi ciljni atribut. Če ima element a atribut target="searchWindow", potem ko kliknete to povezavo, brskalnik najprej poskuša najti okno z takšno interno ime (searchWindow), če ne obstaja nobeno okno s takim internim imenom, odpre novo okno in ga poimenuje searchWindow. In če obstaja okno z istim imenom, se novo okno ne odpre, ampak se stran znova naloži z uporabo navedene povezave v tem oknu. Okna brskalnika privzeto nimajo notranjega imena.

Na primer, odprimo stran »http://www.google.com/« v oknu z imenom myWindow:

window.name = "myWindow";

Na primer, odprimo okno z metodo open() in v njem prikažimo njegovo ime:

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

To okno ima ime: " + wnd.name + ".");

lastnina odpirača

Ta lastnost vam omogoča, da v oknu dobite povezavo do izvirnega okna (okenskega predmeta), tj. do okna, iz katerega je bilo okno odprto.

Na primer, imate izvirno okno (1), v katerem z metodo open() odprete drugo okno (2). V tem oknu (2) lahko uporabite lastnost opener, da dobite okno (1).

funkcija openMyWindow() (var myWindow=window.open("","","width=200,height=200"); myWindow.document.write("Odpri okno (2)"); $(document).ready (function() ( updatefgallowPrompt(true); window.onbeforeunload = WarnUser; ) function WarnUser() ( var allowPrompt = getfgallowPrompt(); if(allowPrompt) ( saveIndexedDataAlert(); return null; ) else ( updatefgallowPrompt(true); dogodek .stopPropagation ) ) funkcija saveIndexedDataAlert() ( var allowPrompt = getfgallowPrompt(); var lenIndexedDocs = parseInt($("#sortable3 > li").size()) + parseInt($("#sortable3 > ul").size( )); if(allowPrompt && $.trim(lenIndexedDocs) > 0) ( event.returnValue = "Vaše sporočilo"; } 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"); }!}

Kasneje je delal zame;

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

Window.onbeforeunload = function () ( return "Ali res želite zapreti?"; );

Morda samo rutina za obravnavo dogodka beforeunload v rokovalniku dogodkov za oddajo obrazca:

JQuery("obrazec").submit(function() ( jQuery(window).unbind("beforeunload"); ... ));

2

Imam eno nadrejeno stran in podrejeno stran. podrejena stran se je odprla v novem zavihku

Ko zaprem podrejeni zavihek, želim prikazati eno opozorilno sporočilo (podrejena stran se zapre).
Kako prikazati zaprto sporočilo ob zapiranju zavihka? (Ni čas za osvežitev)

Uporabil sem OnUnload in onbeforeunload.
Obe metodi se pokličeta tudi pri osveževanju strani in zapiranju zavihkov.

Window.onunload = funkcija doUnload(e) ( alert("Otroško okno se zapira ..."); )

Window.onbeforeunload = funkcija doUnload(e) ( opozorilo("Podrejeno okno se zapira ..."); )

Moram prikazati opozorilno sporočilo, samo zaprite zavihek v brskalniku.

Pomagaj mi. Hvala vnaprej.

Uporabljam naslednji skript. V IE je delovalo. Toda v FireFoxu ni delovalo

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

Kako to doseči v FireFoxu in drugih brskalnikih.

  • 4 odgovori
  • Razvrščanje:

    dejavnost

1

Kajti ta afaik nikoli ni bil scenarij med brskalniki. Rešitev je, da se NE zanašate na nedokumentirane in spremenljive funkcije, specifične za brskalnik, da bi odkrili kar koli pomembnega.

Ker imate stran CHILD, lahko nastavite preizkus nadrejenega (odpirač), ki v intervalih preverja lastnost childWindowHandle.closed in ukrepa v skladu s tem.

1

Ob predpostavki, da samo poskuša sprožiti dogodek beforeunload Crossbrowser, to v veliki meri uspe (razen v Operi)

Try( // http://www.opera.com/support/kb/view/827/ opera.setOverrideHistoryNavigationMode("compatible"); history.navigationMode = "compatible"; )catch(e)() //Our Where Funkcija sporočila F" Are You Going ReturnMessage() ( vrni "WTF!!!"; ) //Funkcija funkcije UnBind UnBindWindow() ( window.onbeforeunload = null; return true; ) //Povezave povezav, za katere ne želimo, da vplivajo na dokument .getElementById("homebtn")

0

Tega morda ne boste mogli storiti, razen pri nekaterih metodah, ki temeljijo na piškotkih, kar je delo razvoja obhodnih rešitev kot netrajnih piškotkov. Druga identifikacija osveževanja strani, preusmeritve na podlagi obrazca ali povratne preusmeritve ali zaprtja brskalnika z odlaganjem dogodkov ni enostavna in dolgočasna. Priporočam, da se ne zanašate na to.

lahko naredite nekaj malenkosti, preden stranka zapre zavihek. javascript zazna brskalnik zapri zavihek/zapri brskalnik , a če je vaš seznam dejanj velik in se zavihek zapre, preden je dokončan, ste nemočni. Lahko poskusite, vendar po mojih izkušnjah ni odvisno od tega. Da, trenutno ne morete razlikovati nazaj, posodobiti in zapreti. Zato ni zanesljivega načina, da bi ugotovili, ali je otrok resnično zaprt.

Window.addEventListener("beforeunload", function (e) ( var confirmationMessage = "\o/"; /* Ali imate kodo majhnega dejanja tukaj */ (e || window.event).returnValue = confirmationMessage; //Gecko + IE vrni potrditveno sporočilo; //Webkit, Safari, Chrome ));