Alertă parametrii JavaScript. JavaScript - metode de alertă, prompt și confirmare. Fixarea atenției vizitatorilor

În această lecție, ne vom familiariza cu metodele obiectului ferestrei: Alertă (), Prompt () și confirmați ().

Metoda de alertă ()

Metoda Alert () este concepută pentru a afișa caseta de dialog de redare a utilizatorului cu mesajul specificat și butonul "OK". Acesta poate fi utilizat pentru a transmite utilizatorilor informații importante.

fereastră.Alert (parametri_1);

Metoda Alert () are un parametru obligatoriu - acesta este textul mesajului care este afișat în caseta de dialog. Această metodă ca urmare a execuției sale nu returnează nimic.

De exemplu, retrageți pentru un vizitator al site-ului, făcând clic pe caseta de dialog de avertizare a linkului: Du-te la site

Confirmați () metoda

Confirmați () Obiectul Window Metod este conceput pentru a afișa caseta de dialog utilizator cu mesajul specificat și butoanele "OK" și "Anulare". O fereastră de confirmare poate fi utilizată pentru a solicita permisiunea unui utilizator să efectueze o anumită acțiune.

var ResultConfirm \u003d Confirm (parametr_1);

Această metodă are un parametru - acesta este textul mesajului care va fi afișat în caseta de dialog.

Metoda Confirm () ca rezultat (rezultat) a execuției sale returnează una din cele două valori:

  • adevărat dacă utilizatorul a apăsat "OK";
  • fALSE dacă utilizatorul a făcut clic pe "Anulare" sau la închis.

De exemplu, eliminăm în elementul r cu id \u003d "rezultatul" rezultatul apasării utilizatorului pe butonul "OK" din caseta de dialog:

Prompt () metoda

Metoda Prompt () este proiectată pentru a afișa caseta de dialog utilizator cu un mesaj, un câmp de text pentru introducerea datelor și butoanele "OK" și "Anulare". Acesta este destinat să solicite date de la utilizator.

var rezultatPROMPT \u003d Prompt (parametri_1, parametri_2);

Această metodă are doi parametri:

  • mesajul care va fi afișat în caseta de dialog. Acest parametru este obligatoriu și conține un mesaj în care "spune" ce date trebuie să intre în utilizator în câmpul de text;
  • al doilea parametru este opțional și poate fi utilizat pentru a specifica valoarea inițială, care va fi afișată în câmpul de intrare al casetei de dialog la deschidere.

În funcție de acțiunile utilizatorului, metoda Prompt () poate returna următoarele date:

  • valoarea textului - dacă câmpul de introducere conține date și utilizator a făcut clic pe "OK";
  • string gol - Dacă câmpul de introducere nu conține date și utilizatorul a făcut clic pe "OK";
  • null - Dacă utilizatorul a făcut clic pe "Anulare" sau închis această fereastră, nu contează ce date au fost introduse în câmpul de text.

Notă: caseta de dialog care apare ca urmare a executării uneia dintre Alert (), Confirm () sau Prompt () este modal, adică Acesta blochează accesul utilizatorului la aplicația parentală (browser) până când utilizatorul închide această casetă de dialog.

De exemplu, solicit de utilizator și rezumă, în funcție de rezultat, textul din elementul id \u003d "NameUser":

De exemplu, cereți utilizatorului să ghicească numărul 8:

... ghici numărul

Și din nou, vă urez bun venit în următorul subiect dedicat limbii JavaScript.în care vom analiza metode Alertă, Prompt, Confrim. Aceste metode sunt încorporate în limba JavaScript. Și să ne ajute să interacționăm cu utilizatorul.
Alerta. Afișează o fereastră de browser cu o informație specifică care pauzează scriptul până când utilizatorul este apăsat de butonul OK.
Prompt.De regulă, afișează o fereastră în care utilizatorul este pus la întrebarea la care trebuie să răspundă într-un câmp specific specific, apoi apăsați tasta OK. De asemenea, utilizatorul nu poate introduce nimic prin apăsarea tastei Anulare.
A confirma. De asemenea, afișează o fereastră în care utilizatorul nu mai poate introduce nimic în câmpul de text și poate să facă clic numai pe butonul OK sau Cancel.
Și acum, după o mică intrare, ne întoarcem la luarea în considerare a celor de mai sus în practică.



Alertă, prompt, confirmați





Ca rezultat, la actualizarea paginii browserului, vom avea o fereastră cu un salut de utilizator. După apăsarea butonului OK, fereastra următoare va apărea în cazul în care numele dvs. va cere. În această metodă există doi parametri, primul este obligatoriu și este responsabil pentru titlul care va fi afișat, în cazul nostru este o chestiune de utilizator. Iar al doilea parametru este responsabil pentru valoarea care va fi afișată ca implicită în caseta de text. Dacă introduceți numele dvs. și apăsați butonul OK, numele dvs. este plasat într-o variabilă nameUser.. Dacă faceți clic pe butonul Anulare, atunci variabila va fi înregistrată nUL.
Și în cele din urmă, fereastra care întreabă utilizatorul, dorește să părăsească site-ul nostru sau nu. În cazul consimțământului la variabila va fi plasată o valoare booleană adevărat.și cu refuz fals respectiv. Asta e tot ce ar trebui să știi despre aceste metode, te văd în următoarele lecții!

  • metode ale obiectului ferestrei;
  • alertă () Metodă: Rezumat scurt;
  • confirmați () - scrieți scrisori;
  • prompt () Metoda - Să ne cunoaștem, sunt Stirlitz.

Deci, obiecte de browser. Și în primul rând - cel mai vechi dintre ei, obiectul fereastră..

Acestea sunt principalele metode ale obiectului fereastră. (În plus față de ei, există alții, dar sunt fixați și pentru a nu aglomerați creierul cu informații inutile, le voi amâna la seria a treia).

Metodă

Descriere

Deschiderea și închiderea ferestrei browserului; Este posibil să se determine dimensiunea ferestrei, conținutul său, precum și prezența unei tastaturi, a câmpurilor de adrese și a altor atribute.

Aspectul casetei de dialog semnal cu mesajul corespunzător.

Aspectul ferestrei de dialog de confirmare cu butoanele "OK" și "Anulare".

Aspectul ferestrei de dialog Sfaturi cu un câmp de introducere a textului.

Instalarea sau ștergerea unui focus pentru fereastră.

Derulați conținutul ferestrei într-un anumit punct.

Setați intervalul de timp între provocarea funcțională și calculul expresiei.

Setarea unui interval de timp unic la un apel funcțional sau calcularea expresiei.

Știm deja asta fereastră. Se însemne adesea, dar nu este scris.

Apelați dialogul diferit Windows

Caseta de dialog este utilizată în programe pentru a interacționa cu utilizatorul.

Metoda de alertă ()

Ne-am dezasamblat la începutul cursurilor noastre. Creează cea mai simplă casetă de dialog cu mesajul și butonul OK. Toată interacțiunea sa este limitată de faptul că utilizatorul apăsând acest singur buton, poate trimite această fereastră undeva departe (și vă mulțumesc).

Confirmați () metoda

Metodă a confirma () Deja oferă utilizatorului să ia cea mai simplă soluție "booleană": spuneți "da" sau "nu".

De exemplu, faceți clic pe acest buton:

Îmi pare rău pentru tragerea mică. Sper că știți cum să utilizați butonul "Înapoi".

Cum se aranjează totul? Desigur, ați văzut că am avut această metodă combinată cu alertele. Și acest lucru se face folosind o funcție introdusă în .

Metoda returnează două valori: adevărat. (dacă OK) și fals (dacă este anulată).

ÎN adevărat. Îl trimitem la pagina corespunzătoare (proprietate href. Obiect locație) și eliminați corespunzător alerta (). Altfel (adică fals) Doar scoateți altul alerta ().

Și în buton apelați funcția în cadrul evenimentului onclick.:

Și apoi trebuie să apelați această funcție din manipulatorul evenimentului onsubmit. Etichetă.

, de exemplu:

"http://narod.yandex.ru/send-poll.xhtml" Metoda \u003d "Post" onsubmit \u003d. "Returnați confirmarea ()" >

Aici, de exemplu, mă puteți scrie pe "săpun" tot ce vă gândiți la lecțiile mele. Dacă dintr-o dată am fost încântați și apăsat butonul și apoi ceva ciudat a început cumva să populeze fereastra de dialog și să te stoarcă.

Dacă faceți ferestre pop-up, atunci un ton bun este de a avertiza despre acest utilizator și de a da o alegere - deschideți fereastra sau nu deschideți. Pentru a face acest lucru, înainte de a descărca fereastra, trebuie să eliberați un dialog "parlamentar" a confirma (). Aici funcția este chemată de la . Vom vorbi foarte curând despre asta când ne întoarcem la crearea de ferestre prin metodă deschis ().

Prompt () metoda

Această metodă solicită deja date specifice de la utilizator. O casetă de dialog apare cu un câmp de intrare. Metoda returnează datele pe care utilizatorul le-a introdus acest câmp și permite programului să funcționeze cu aceste date.

Metodă prompt () Două argumente: întrebarea (care apare deasupra câmpului de introducere) și răspunsul (text în câmpul de intrare):

Dacă doriți ca câmpul de introducere să apară curat, puneți ghilimele goale cu al doilea argument:

prompt.("text de întrebare","")

Să ne uităm la ea în acțiune. Faceți clic pe buton, nu vă fie frică.

Deci, ați introdus (sau nu ați introdus date) și ați primit de la computer răspunsul pe baza acestor date (sau absența).

Iată o simplă variantă a acestei caracteristici:

Proprietate innerhtml., permițând controlul conținutului etichetei, ne-am întâlnit în 10 lecție când am programat numele sub imagini.

Dar codul butonului și paragraful gol pentru salutări.

Dar dacă v-ați dovedit a fi mâneca mea, au văzut că funcția a reacționat la ea.

Cum să faceți acest lucru în versiunea "grosieră", vă puteți ghici deja. Trebuie să verificați variabila nume de utilizator nu numai pe ghilimele goale, ci și pe " Andrew"și să investească altul dacă cu textul corespunzător (vă puteți practica).

Dar dacă scrii " Andrew", "Andryusha.", "Andryushka.", "Andryukha.", "Andreyka.", "Andrei Ivanovich.", etc. Rezultatul se va dovedi a fi similar, deși nu m-am mișcat în mod clar toate aceste valori, dar am mers doar în jurul a cinci rânduri:" Andre.", "Andry.", "Andrei.", "Andreche."Și" Andrechu."(Trei, ultima - pentru a exclude Andreyevko, Andreichenko și Andreychuk, păstrând în același timp Andreychik în airists).

Adică puteți ghici că funcția verifică variabila nume de utilizator Pe primele 5, 6 sau 8 caractere.

Dar vom vorbi despre asta mai târziu când ne întoarcem la obiectele șirului și metodele lor. Vreau doar să pre-reprezinați acele sarcini pe care trebuie să le rezolvăm (în special, tot felul de rânduri de divizare pentru substring). Apoi soluțiile în sine vor părea mai clare. Dar dacă nu tolerează, puteți "desena" funcția din cod și "Împărțiți sub piuliță". Căci curioși am scris comentariu acolo.

Metodă prompt () De asemenea, puteți utiliza pentru a introduce parola.

Acesta nu este sfârșitul lecției!

Să spunem ca spionii să citească acest capitol până la sfârșit. În primul rând, încercați să apăsați și să introduceți ceva.

Ah, așa e! Dar vezi, a apărut un alt buton! Bine ...

Parola:

Apăsați din nou primul buton și introduceți parola corectă.

Toată această distracție, poate, lovește efectul, dar, de fapt, parola poate fi găsită prin apăsarea butonului drept și priviți-o în cod. Cineva poate gândi naiv că este suficient să puneți codul într-un fișier separat. Dar în codul paginii va fi un link către acest fișier cu o adresă care indică. Și dacă îl formați în bara de adrese, fișierul cu codul JavaScript se va deschide :)

Este posibil să criptați parola în cod? Este posibil, dar pentru asta din nou, sunt necesare manipulări cu rânduri împreună cu utilizarea unor metode matematice. Când ajungem la toate acestea, vom studia scriptul de parolă "real". Dar tehnica de interacțiune cu utilizatorul va fi aceeași: metoda prompt (). (Este posibil să "împărțiți" o parolă criptată? Din păcate, perfecțiunea hackerilor nu există nici o limită ...)

Așa cum am "prins" numele sau absența ei, prindeți funcția și parola.

Dacă introduceți parola greșită sau să nu introduceți nimic, șirul

document.getelementbyid ("nu"). Stil.display \u003d "bloc"

deschideți blocul cu al doilea buton

Și dacă este introdusă parola corectă, acțiunea este transmisă de linie

document.getelementbyid ("da"). Stil.display \u003d "bloc",

care deschide următorul bloc

Opriți-vă, și ce este acolo pentru crackerbry? Aceasta este o criptare necomplicată, voi explica în curând.

Între timp, dau codul acestor blocuri (pentru claritate reduc tabelul cu cadrul, care este închis pe ultimul bloc):


"Nu există" Stil \u003d ": Nici unul". \u003e

Ah, așa e! Dar vezi, a apărut un alt buton! Bine ...




"MyPassWord" Stil \u003d "Afișaj: Nici unul;" \u003e

Parola:


Apăsați din nou primul buton și introduceți parola corectă.



"Da" Style \u003d ": Nici unul". \u003e

Acum citim.


. . . . .
. . . . .

Deci, despre criptare. Ea este foarte mizerabilă. Oriunde escape () și unescape (), Am hacked imediat.

Funcţie escape ("Introduceți un șir aici") Convertește simbolurile în valorile lor hexazecimale.

Funcţie unescape ("Introduceți agitația") Efectuează o acțiune inversă.

Pentru a cripta astfel parola, trebuie să o conduceți acasă escape (), copiați rezultatul și introduceți-l în unescape (). Dar asta, repet, frivol.

Ei bine, pentru un set complet - o funcție pentru al doilea buton:

Pentru ieșirea standard casetele de dialog JavaScript are doar trei metode pe care le-am învățat astăzi. Deși aceste metode nu se întâmplă atât de des, capacitatea de a le contacta extrem de utilă. Ele sunt simple, dar în același timp tratați, ca să spunem, pentru a "puține" programare. Ele sunt foarte bine luptate în mână în stăpânirea limbajului de programare. Și vă sfătuiesc în orice mod de a experimenta cu ei, chiar și în mod vizibil din punct de vedere pragmatic. Programare bună - Acesta este un joc fascinant, cu toate acestea, orice creativitate.

Organizarea dialogului cu un vizitator de resurse web poate fi executată căi diferite, a cărui utilizare funcții JavaScript. Alert () este cea mai simplă și mai rapidă opțiune. Această opțiune este deosebit de bună pentru scopuri de testare, dar în multe resurse este folosit ca funcționalitate naturală.

Funcția de alertă JavaScript () vă permite să obțineți un răspuns afirmativ. De fapt, nu este un răspuns, ci chiar informarea informațiilor. Mai mult, resursa web încetează să funcționeze până când utilizatorul răspunde. Răspunsul prin alertă este întotdeauna singur - acesta este răspunsul!

Pentru a depana Alert JavaScript (), instrumentul ideal care vă permite să obțineți rapid informații de top, să luați o decizie și să continuați să lucrați. Dar pentru a funcționa normal a site-ului, are, de asemenea, o cantitate echitabilă de avantaje.

Fixarea atenției vizitatorilor

"Alertă" - ca și în viață, formează un eveniment, de către cine să nu treacă. Dar acest eveniment nu se poate întâmpla.

Un dezvoltator rar știe despre această circumstanță și așteaptă dureros site-ul său de mult timp în partea clientului său. În același timp, puțini dintre dezvoltatori nu știu: găsiți o greșeală în client, adică în browser, adesea atât de dificil ca:

  • fără timpuri de timp prețios;
  • sunt cheltuite transformări de cod incredibile;
  • masa scripturilor, în cuvinte, primește browserul și serverul.

Și nu există rezultate. Nici nu vă ajută niciunul de debarcare, nici unelte de depanare încorporate în fiecare browser. Între timp, Lark-ul întotdeauna se deschide pur și simplu - cheia potrivită este importantă.

O regulă simplă de cod corect

În primul rând, cookie-urile au devenit cele mai căutate componente ale site-ului modern. Nu ar trebui să uitați niciodată:

  • JavaScript Alert & Document Cookie
  • "Aici și acum" și "deloc sau vreodată".

Cookie-urile reprezintă o mare oportunitate de a vă aminti în adâncurile browserului despre fiecare client, dar nu trebuie să oferiți aceste valori în sesiunea curentă. Principalul preocupare cookie: Rămâneți în "Memoria" browserului în conținutul pe care la avut în momentul plecării vizitatorului.

În toate restul codului de script în adâncurile browserului depinde doar de evenimentele pe care le procesează.

În acest context, și contextul acestui lucru este ideal, codul nu poate decât să funcționeze dacă este scris corect. Aceasta este regula perfectă pentru codul corect. Dacă browserul prezintă un ecran curat sau ceva nu face ceva, există un motiv pentru a-și asuma prezența unei erori.

Pur și simplu aplicați simplu:

  • JavaScript Alert ("Până acum era bine!").

Cel mai bun Debager sau Debugger - un eveniment care trebuie să apară dar nu se întâmplă.

Prin mutarea acestui design în jos de la zero la o crimă enervantă în cod, puteți detecta locul după care nu funcționează. Eroarea va fi găsită. JavaScript Alert () este fereastră modală . Nu poate fi bypass, și nimic nu va fi pornit până când dezvoltatorul / vizitatorul închide această fereastră.

Dacă fereastra nu apare, înseamnă că nu este desemnată în cod, sau tot ceea ce merge la acesta conține o eroare.

O situație dificilă în care Alert JavaScript nu funcționează

Acest lucru este în principal legat de algoritmii de schimb de informații AJAX cu serverul. Nu este întotdeauna posibilă aplicarea instrumentelor clasice de depanare și când un sistem de obiecte multi-nivel funcționează pe partea clientului, depanarea este, în general, transformată într-o conștiință a dezvoltatorului și nici un debugger să ajute.

Cea mai bună versiune a alertei în procedura de comunicare cu serverul este un div (DIV), care este plasat în protocolul de comunicare cu metoda Innerhtml - va fi întotdeauna clar în ce etapă există o problemă.

Diva statică, care este întotdeauna vizibilă pe pagină - aceasta nu este o fereastră modală din Alertă JavaScript. Fereastra nu poate apărea, iar motivele pentru care pot fi un set, iar emiterea este corectă din punct de vedere sintactic. Limba browserului se distinge printr-un temperament calm și nu va lua niciodată acțiuni, dacă ceva nu a dezasamblat și nu a înțeles.

Staticarea oricui tAG HTML. - Un factor bun. Scoateți întregul cod și adăugați-l în porțiuni până când eroarea apare din nou, nu este cea mai rapidă tehnologie pentru depanare. Scrierea corectă - sfatul este popular, în cerere, dar nu practic.

Limba browserului - Lucrările la evenimente, preocuparea sa principală nu este un cod serial, ci performanța funcționalității atribuită etichetelor de pagină și a evenimentelor de procesare.

O regulă suplimentară la o regulă simplă

Dacă fereastra de la Alertă JavaScript ("Încă totul este scrisă corect") nu a apărut în browser, înseamnă că sintaxa la locul în care este înregistrat acest design, nu provoacă o îndoială browser și este executată corect.

Logica scrisului de stil modern are un dezavantaj semnificativ. Toate fișierele de pagină se îmbină împreună (cu esența și tipurile sale) într-un întreg și apoi Dom este construit. Procedura de conectare a fișierelor este adesea esențială.

Este cel mai bine atunci când dezvoltatorul nu dă valorile principiului de evenimente de a organiza executarea funcțiilor atribuite evenimentelor și are toate funcțiile în secvența aplicației și destinației la etichete și evenimente de pagină.

Ordinul este întotdeauna cel mai important. Cu restul JavaScript-ului se va da seama: ce și când să sunați. Programarea modernă în general și în contextul oricărei metode, orice abordare orientată spre obiecte organizate în special - în special - întotdeauna secvențial. Întotdeauna se combină și în mod constant ca descriptiv.

Dacă nu se întâmplă ceva, atunci: Nu undeva ceva nu este greșit, ci numai înainte de locul ăsta.