JQuery je javascript biblioteka, čija je svrha "pisanje manje, učiniti više". JQuery se lako povezuje na web mjesto i počnite koristiti. Koristeći jQuery, postaje mnogo lakše koristiti JavaScript na vašoj web lokaciji.
jQuery eliminira cijeli zujanje JavaScript koda i omogućava vam implementaciju ovog reda u samo jednoj metodi.
Šta je Ajax?
Ajax je asinhroni (I.E. pretraživač, slanje zahtjeva, može učiniti bilo šta, na primjer, da pokaže poruku čekajući odgovor, pomaknite stranicu itd.) JavaScript i XML. Koristi se za stvaranje dinamičnih i brzih web stranica. Ajax nam omogućava ažuriranje dijela web stranice bez ponovnog pokretanja cijele stranice.
Šta je sa jquery i ajaxom?
Kombinacija jQuery i ajax pružaju snažnu funkcionalnost. Od koristeći jQuery I Ajax možete podnijeti zahtjev i dobiti informacije u različitim formatima, uključujući XML, HTML i čak normalan tekst. Možete koristiti JSON format za razmjenu podataka. Podaci primljeni od strane AJAX zahtjeva možemo koristiti na našoj HTML stranici.
jQuery čini postojeći preglednik Ajax API-ja moćniji i lakšiji za upotrebu. Kreirajte Ajax pozive na uobičajen način pomoću JavaScripta, malo teške: Budući da morate uzeti u obzir da različiti preglednici zahtijevaju različite pristupe za stvaranje XMLHttPrequest objekta. Pored toga, slanje podataka, na primjer, iz oblika postaje teže ako koristite uobičajeni JavaScript za poziv Ajaxa.
jQuery pruža jednostavnu i moćnu funkcionalnost koja proširuje JavaScript AJAX metode i pruža fleksibilniji pristup.
U ovom malom članku pokazat ću vam kako koristiti jQuery i ajax u jednostavan PHP. obrazac. Započnimo ... Da bismo koristili jQuery i ajax, potrebne su nam dvije datoteke, prva datoteka sadrži HTML / PHP kôd, kojom će se sastaviti upit AJAX. U drugoj datoteci ćemo podnijeti AJAX upit i vratiti rezultat na prvu stranicu.
Korak 1. Kreirajte datoteku s školskom.php i umetnite sljedeći kôd u nju:
U gornjem kodu dobivamo ime i broj studenta i, koristeći jQuery i ajax, pošaljite ih detaljima.php.
| TVOJE IME: | ||
| Broj rolne: | ||
Korak 2: Kreirajte detalje.php i stavite sljedeći kod u njega:
U gornjem kodu, dobivamo adresu učenika koristeći broj sekvence i njeno ime.
Za ovaj primjer trebate stvoriti školsku bazu podataka i studentske tablicu. Studentski stol sadrži polja sa imenima, redoslijedom i adresom.
Nadam se da će vam ovaj članak biti koristan.
Metoda post () obično je dizajnirana za slanje podataka na poslužitelj (na primjer, iz obrasca).
U kontekst metode post vrijedi spomenuti jSON. - Format teksta na osnovu JavaScripta. Može se koristiti gotovo bilo koji programski jezik.
jQuery, Ajax Zahtjev Post metoda
jquery.post (URL ,,,,)- Prvi argument (URL) je URL dokumenta u kojem se zahtjev šalje;
- Drugi argument (podaci) su podaci poslani na server, u pravilu predstavljeni kao objekt JS;
- Treći argument (povratni poziv (podaci, tekstuatus, jqxhr)) je F-i pozvao nakon odgovora servera. Kao argumenti ova značajka Potrebno je podatke koje poslužitelj šalje kao odgovor na zahtjev i status kako je zahtjev izveden.
json_decode () i json_encode ()
U pHP jezik (Od 5.2), JSON podrška je uključena u kernel u obliku JSON_DECODE () funkcije (dekodira JSON string) i JSON_ENCODE (), koji se pretvaraju JSON tipove podataka u odgovarajući vrste PHP. i obrnuto.
1, "B" \u003d\u003e 2); Echo json_encode ($ arr); ?\u003e.Rezultat
("A": 1, "B": 2, "C": 3, "D": 4, "E": 5)PHP Primjer rada json_decode
$ JSON \u003d "(" A ": 1," B ": 2)"; Var_dump (json_decode ($ JSON, true)); $ Arr \u003d json_decode ($ JSON, TRUE); Eho ""$ Arr [" A "]."
"$ Arr [" b "]."
";
Rezultat
Array (5) (["a"] \u003d\u003e int (1) ["b"] \u003d\u003e int (2)) 1 2Primjer rada upita AJAX po post metodi
Šta da radimo:
Provjerite ispravnost poslanih podataka (Post Zahtjev Ajax) podataka (podaci unose korisnik). Ako su podaci tačni, prikažite poruku. U suprotnom, napravite crveni pozadinsko osvetljenje na poljima. Sve radi asinhrono, odnosno bez ponovnog pokretanja stranice. možeš koristiti ovaj princip, Na primjer, da biste stvorili sistem komentara sa umetanjem komentara u bazu podataka.
jQuery.
$ (Dokument) .ready (funkcija () (var rad \u003d lažno; / * Ova zastava sprečava slanje nekoliko komentara: * / $ ("obrazac"). Pošalji (Function (e) (e.preventdefault (); ako (rad) ) return false; Radno \u003d true;. $ ( "# podnijeti") Val ( "Čekaj .."); $ ( "greška") Removeclass ( "greška");. $ .post ( "submit.php", $ (ova) .serialize (), funkcija (MSG) (/ * Pošalji oblik vrijednosti u submit.php: * / Radno \u003d false; $ ( "# podnijeti") Val ( "pošalji"); if (por.. status) // Ako su podaci ispravni, dodajte poruku (Console.log (MSG.Status); $ (msg.html) .hide () InsertBefore ( "obrazac") SlideDown ();..) Else (// Ako postoje greške, Prolazimo kroz objekat objekat // msg.errors i da ih na stranici $ .Svaki (MSG.ERRORS, FUNKCIJA (K, V) ($ ( "#" + K) .AddClass ( "Greška"); // Alert (k);));)), "JSON");));));HTML.
PHP.
// prihvaćamo podatke koji su došli ajax $ arr \u003d $ _post; $ arr \u003d $ _post; IF (Filter_var ($ arl, filter_validate_email) && filter_var ($ arr, filter_validate_int)) (echo json_encode (niz ("status" \u003d\u003e 1, "html" \u003d\u003e "U ovom članku, primjeri koda koji koristim je poslati aJAX zahtjevi na server okolo jQuery.. Njihovi zadaci mogu biti različiti, tako da možete koristiti različite funkcije koje pojednostavljuju šifru za pisanje.
HTML zahtjev za podacima pomoću funkcije opterećenja
Ovo je najlakši ajax upit putem jQuery za dobivanje HTML podataka i umetnite ih u dom element pomoću ID \u003d "Rezultat" (sadržaj elementa je zamijenjen):
$ ("# Rezultat"). Učitavanje ("
Naprednija verzija opterećenja:
$ ("# Rezultat"). Učitavanje ("
U ovom primjeru, poslužitelj takođe prenosi parametre, a nakon primitka odgovora nije provjeren je li ne postoji greška (na primjer, odgovor poslužitelja nije primljen) i obavljaju različite radnje.
Ajax zahtevi dobivaju i post funkcije
Ove funkcije se isporučuju pomoću AJAX Query HTTP metode dobivaju i postavi. Dat ću nekoliko primjera njihove upotrebe.
$ .get ("
Prijenos podataka nije potreban, kao i obavljanje bilo kakvih radnji nakon prijema odgovora sa servera, I.E. U ovom slučaju, nizove 3 i 4-6 mogu se ukloniti, ako je potrebno, i na taj način smanjiti kod.
Vrsta podataka dobivenih sa poslužitelja može se odrediti dodavanjem podatkovnog lipa (vidi sljedeće) - zadano se automatski određuje.
Korištenje ponde je slično, ali u sljedećem primjeru koristim funkcijski poziv nakon prijema odgovora sa servera.
$ .post ("
U stvari, dobivanje i post funkcije su skraćene opcije za funkciju AJAX, koja će u dolje razmotriti.
Getjson JSON podaci
getjson - skraćena varijanta AJAX-a upita pomoću metode dobiti i primanja podataka kao json. Metoda je prikladna, na primjer, da biste dobili neki niz s podacima i naknadnim radom s njim.
$ .getjson (") Na strani poslužitelja program formira niz i pretvara ga u json niz, na primjer, kako slijedi: $ arr \u003d niz (); $ arr \u003d Array ("ID" \u003d\u003e 10, "Tekst" \u003d\u003e "Test linija 1"); $ arr \u003d Arr \u003d Array ("ID" \u003d\u003e 20, "Tekst" \u003d\u003e "Test linije 2"); $ arr \u003d Arr \u003d Array ("ID" \u003d\u003e 30, "Tekst" \u003d\u003e "Test line 3"); Echo json_encode ($ arr); Slično tome, STDClass objekti mogu se prenijeti sa servera, pretvaranjem ih u json niz. Sada ću dati primjer jednostavne funkcije upita AJAX i primanje HTML podataka. $ .AJAX (URL: " Zahtjev za poslužitelj javlja se metoda dobivanja, jer Parametar odgovoran za vrstu zahtjeva, zadani tip je dobivanje. Primjer izvršenja funkcije upita AJAX s prijenosom podataka po pošti pomoću metode i obrade događaja. Ispod ću opisati dodatne opcijekoji se najčešće primjenjuju. $ .AJAX (URL: " Dugme za slanje podataka:
U primjeru, kada kliknete na gumb Button, status dugmeta prve promjene (tekst na to mijenja na "slanje ...", a ona postaje nije aktivan), koja se obavlja pomoću parametra Beforesend. Tada se zahtjev šalje na prijenos željenih podataka. Nakon što se odgovor primi s poslužitelja, status gumba vraća se na isti (tekst se mijenja u "slanje" postaje aktivna). Odgovor se dobiva kao JSON podaci. Ukratko opišite parametre slanja Ajax zahtjeva, koji možda najčešće dolaze dobro: Ispod ću dati još nekoliko primjera korištenja AJAX upita. Uzorak HTML kod:
Jednostavan ajax upit putem jquery koristeći funkciju AJAX
Složeniji primjer zahtjeva AJAX putem jQueryja
url
Slanje AJAX zahtjeva Adresa
vrsta
Način slanja zahtjev za dobivanje. ili post.
podaci.
Podaci poslani podaci. To može biti niz s parametrima i njihovim vrijednostima u par1 \u003d Val1 & par2 \u003d val2 & ..., jQuery objekt, na primjer, $ ("ulaz") ili drugi podaci.
datatip
Vrsta podataka sa servera. Može biti html, json, tekst, skripta i XML.
skladiste.
Keširanje preglednika upita (FALSE - ne keširati).
async.
Izvršenje asinhronog upita, I.E. Program se i dalje izvrši bez čekanja na odgovor poslužitelja. Ako navedite lažno, upit će biti izveden sinkrono, dok stranica neće odgovoriti na bilo šta dok se odgovor ne primi sa poslužitelja.
procesData.
Pretvaranje podataka poslanih u URL formatu. Ako je potrebno da se podaci ne transformišu, instaliraju u lažno. Na primjer, prilikom slanja slike na poslužitelj ili XML podatke.
sadržaj.
Vrsta prenesenih podataka, zadane "aplikacije / x-www-forl-urlencoded; charset \u003d utf-8". Ako navedite lažno, naslov neće proći tip koji može biti potreban, na primjer, prilikom slanja slike na server.
prepustiti.
Funkcija izvršena prije slanja zahtjeva AJAX.
kompletan.
Funkcija se izvodi nakon primitka odgovora sa servera (bilo koji, uspješan ili ne).
uspeh.
Funkcija izvedena sa uspješnim upitom.
greška
Funkcija se izvodi u slučaju pogreške.
Slanje obrasca sa svim podacima Ajax zahtjeva putem jQueryja
JavaScript kod:
$ ("# Mymform"). Pošalji (e.preventdefault (e); $ .Ajax ((tip: $ (ovo) .attr ("metoda"), URL: "
Da bi se stranica ponovo pokrenula klikom na gumb "Pošalji", prvo otkažite standardne akcije pretraživača koristeći e.PreventDefaults () .
U parametru podataka prenosimo sva polja obrasca koristeći $ (ovo) .Serialize () - Ova funkcija pretvara sve ulazne podatke i bira u nizu pogodan za slanje na poslužitelj.
Takođe, ovdje se koristi parametar. async: FALSE. Dakle, dok se obrazac ne ide na server, ništa drugo nije moglo biti pritiskanje ili urađeno.
Slanje slike ili ajax datoteke upita putem jQuery
Zadatak slanja datoteke ili slike poslužitelju bez ponovnog pokretanja stranice često se često događa. U ovom primjeru, skalalni od 2 čipsa odjednom: odaberite datoteku pritiskom na tipkušto se može uokviriti kao i prikažite napredak prilikom prijenosa datoteke Ajax Zahtjev Server.
hTML kod će biti takav:
#addfile (Pozicija: Relativna; Skrivena; Širina: 180px; Visina: 34px;) # Load_File (Pozicija: Apsolut; TOP: Širina: 180px; Veličina fonta: 0px; Proporterity : 0; filter: alfa (neprozirnost: 0);) #load_file: lebde (pokazivač: pokazivač;)
Suština ideje je da se standardni ulaz prikazuje na vrhu gumba za odabir datoteke, ali je potpuno prozirna i ima iste dimenzije kao i tipku. Dakle, korisnik vidi gumb, ali kada kursor dovodi do njega, u stvari dovodi do ulaza. U skladu s tim, kada pritisne dugme, zapravo pritisne izbor ulaznog datoteka. Da ne biste treptali kursor nakon odabira datoteke, veličina fonta postavljena je na 0px.
Sada JavaScript Pošaljite kôd datoteke na server sa prikazom napretka:
$ (Funkcija () ($ ("# load_file"). Uključeno ("Promjena", opterećenja);)); Funkcija LoableFile () ($ ("# addfile Span"). HTML ("Pošaljite 0%"); datoteke \u003d $ ("# load_file"). Datoteke; var form \u003d novi form.append (); , Datoteke); $ .AJAX ((URL: "
Kada se datoteka učita na poslužitelj, tipku će se prikazati koliko je% već prebačeno na server. Nakon završetka preuzimanja, naziv gumba vraća se kao i vrijednost i vrijednost unosa i datoteke postavlja se prazna tako da možete ponovo odabrati novu datoteku.
Primjer dijela poslužitelja na PHP-u (na zahtjev Eugenea):
$ Poruka \u003d \u200b\u200b""; If (prazan ($ _ datoteka [ "Pošalji"] [ "name"]) || $ _files [ "Upload"] \u003d\u003d "None") ($ poruka \u003d \u200b\u200b"Niste izabrali datoteku";) ($ else if _Files [ "Upload"] [ "veličina"] \u003d\u003d 0 || $ _files [ "Upload"] [ "veličina"]\u003e 9.437.184) ($ Poruka \u003d "veličina datoteke nije u skladu sa standardima (maksimalno 9 MB) ";) else if (($ _Files [" Upload "] [" tipa "]! \u003d" image / jpeg ") && ($ _files [" Upload "] [" tipa "]! \u003d" Image / pjpeg ") && ($ _files [ "Upload"] [ "tipa"]! \u003d "image / gif") && ($ _files [ "Upload"] [ "tipa"]! \u003d "image / png")) ($ poruka \u003d "ljubimce download slika samo JPG, GIF i PNG. ";) else if (is_uploaded_file ($ _ datoteke! Nešto nije u redu Pokušajte ponovo preuzeti datoteku [" Pošalji "] [" TMP_NAME "]) ($ poruka \u003d)".. ";) else ($ FType \u003d $ _files [" Upload "] [" tipa "]; $ Fname \u003d" NewName_Image image / gif GIF ": ($ FType \u003d\u003d". "($ FType \u003d\u003d." "?" "?" image / PNG PNG ":" jpg ")); if (move_uploaded_file ($ _ datoteka [" upload "] [" TMP_NAME "], $ _SERVER [" DOCUMENT_ROOT "]." / datoteke /".$ Fname) ) ($ poruka \u003d "uspješno učitan.";) else ($ poruka \u003d "Nešto je krenulo ne da do. Pokušajte ponovo preuzeti datoteku. ";)) Izlaz ($ Poruka);
Informacije o preuzete slici bit će sadržane u $ _Files ["upload"], jer Datoteka skripte dodana je na sljedeći način: obrazac.Append ("upload", datoteke); U skladu s tim, sve što je potrebno iz PHP programa je provjeriti da datoteka odgovara očekivanim parametrima, prenesite datoteku na Željena mapa (U primjeru u mapi datoteka) pod slijedećim imenom (u primjeru NewName_Image) i vratite odgovor na preglednik, koji je u mom primjeru jednostavno prikazan naredbom upozorenja korisnika (poruka);
Situacije u kojima možete i čak trebate koristiti AJAX upite, puno i svi ovdje ne rastavljaju. Ipak, ako postoje prijedlozi, koji drugi primjeri imaju smisla dodati ovdje, pišite u komentarima.
Ne mogu poslati najjednostavniji zahtjev Do servleta pomoću jquery. Ali istovremeno, ako pošaljem kroz obrazac, sve radi sa praskom. Ispod dajem index.html, iz kojeg želim poslati korisničku prijavu. Prijava.js, u kojem sam sam zahtjev, serletstore.java sama servlet. I strukturu cijelog projekta.
prijava.js. Jedini manje radni URL \u003d "http: // Localhost: 8080 / testservlet / post", i oni "/ testservlet / post", "testservlet / post", "," / post "," post "uzrokuje grešku 404.
Funkcija AddNewVoting () (var xhr \u003d novi XMLHttPrquest (); var body \u003d "naziv \u003d" + encodeurikomponent ("Ime") + "& prezime") + encodeurikomponent ("prezime"); xhr.open ("post", " http: // Localhost: 8080 / testservlet / post ", true) xhr.setrequestherher (" Sadržaj "," Aplikacija / X-www-form-urlencoded ") xhr.send (tijelo);); Funkcija AddNewVoting1 () (var korisnik \u003d ("Vlad") Var JSonstring \u003d json.stringify (korisnik); var url \u003d "http: // localhost: 8080 / testservlet / post"; $ .AJAX ((URL .AJAX ((URL) : URL, metoda: "Post", podaci: jszoryng, contenttype: "Aplikacija / JSON", greška: funkcija (poruka) (poruka); console.log (jsonobject);), uspjeh: funkcija (podaci) (podaci) jsonObject \u003d json.parse (podaci); console.log (jsonobject);), zaglavlja: ("Prihvati": "Aplikacija / JSON", "Prihvata", "CACHE-CONTROL": "Max- Starost \u003d 3600 ")));););
Prilikom pozivanja druge funkcije prikazuje ga:
index.html
Servletstore.java.
Uvoz javax.servlet.servletexception; uvoz javax.servlet.annotation.webservlet; Uvoz javax.servlet.http.httpservlet; Uvezi Javax.Servlet.http.httpservletRequest; Uvoz javax.servlet.http.httpservletresponse; Uvozi java.io.ioexception; Uvoz java.io.printwriter; @Webserlet (naziv \u003d "Post", urlpatterns \u003d "/ post") servlet javne klase (@override zaštićena praznina pameta (httpservletrequest req, httpservletrestrukseps resp) baca servlexception, ioexception (printwriter writer \u003d resp.getwriter (); pisac. Ispis ("Hello");) @Override zaštićena praznina dopost (httpservletrequest req, httpservletresponse resp) baca servlesexception, ioexception (super.dopost (req, resp);))
Struktura projekta.
Lekcija u kojoj će u primerima razmotriti stvaranje jednostavnih asinhronih ajax zahtjeva na poslužitelju. Kao metoda za prijenos zahtjeva, koristit ćemo i dobivanje metode i metodu nakon. Na poslužitelju ćete izvršiti zahtjeve pomoću PHP skripta.
Šta je Ajax asinhroni zahtjev?
Ajax tehnologija se uglavnom koristi za stvaranje asinhronih zahtjeva na poslužitelju. Asinhronski upit je takav zahtjev koji se izvodi u pozadini i ne sprečava korisniku da komunicira sa stranom.
Prilikom slanja asinhronog zahtjeva, pretraživač (stranica) nije "smrznut", I.E. S njom, kao i prije, možete raditi. Ali onda, kako znati kada odgovor dolazi sa servera. Da biste odredili ovo, morate pratiti svojstvo Readystate pretraživača (status spremnosti). Ova nekretnina sadrži broj po kojem se može prosuditi vrijednost koja je faza istraga. Sljedeća tablica prikazuje glavne vrijednosti Readystate imovine i odgovarajućih država.
Oni. Ispada da moramo pratiti kada će vrijednost Readystate imovine biti jednaka 4. To će značiti ono što je poslužitelj odgovorio na poslane. Preostale vrijednosti u praksi koriste se prilično rijetko, a neki preglednici ih ne mogu podržati.
Da bi se utvrdilo u kojoj fazi je upit, morate koristiti XMLHttPrequest OneryeadyStateChange objekt. Ovaj se događaj javlja svaki put kada se vrijednost prometovane imovine mijenja. Slijedom toga, u rukovodiocu ovog događaja (neizvedena ili imenovana funkcija) možete registrirati akcije koje će provjeriti je li ova nekretnina 4 jednaka i, na primjer, odgovor na izlaznu poslužitelju na stranicu.
Stvaranje asinhronog ajax upita (dobiti metodu)
Razmotrite stvaranje asinhronog Ajax zahtjev Na primjeru, koji će biti nakon preuzimanja stranice da biste dobrodošli korisnika i prikazivali njegovu IP adresu.
Da biste to učinili, morate stvoriti 2 datoteke na poslužitelju u jednom direktoriju:
- dobrodošli.HTML - HTML stranica koja će se prikazati korisniku. Na istoj stranici stavite skriptu koja će izvršiti sve potrebne radnje za AJAX rad na strani klijenta.
- obrada.php - PHP datoteka koja će obraditi zahtjev na strani poslužitelja i formirati odgovor. Počnimo razvijati se od stvaranja osnovne strukture dobrodošlice.HTML datoteke
Primjer AJAX-a
Razmislite o slijedu radnji koje je potrebno izvršiti na strani klijenta (u JavaScript kodu):
- Metoda s kojom će biti poslan na server (dohvati, post).
- URL koji će obraditi zahtjev poslužitelja.
- Tip zahtjeva: sinhroni (lažni) ili asinhroni (istinito).
- Ime i lozinka ako je potrebno.
Pretplatite se na slučaj OnReadyStateChange iz XHR objekta i istaknite upravljač kao anonimnu ili imenovanu funkciju. Nakon toga kreirajte kod unutar ove funkcije, što će provjeriti status odgovora i izvesti određene korake na stranici. Odgovor koji dolazi sa servera uvijek je u nekretnini odgovorne.
Uz to, uz važeću vrijednost Readystate imovine broj 4, možete provjeriti vrijednost svojstva statusa. Ova nekretnina određuje status upita. Ako je 200, onda je sve u redu. U suprotnom, došlo je do pogreške (na primjer, 404 - URL nije pronađen).
Poslat ćemo zahtjev poslužitelju pomoću metode slanja ().
Ako koristite metodu Get za slanje upita, zatim prenesite podatke na parametar ova metoda nemoj. Prenose se kao dio URL-a.
Ako koristite metodu post za slanje upita, tada se podaci moraju prenijeti kao parametar pomoću metode slanja (). Pored toga, prije poziva na ovu metodu, morate instalirati zaglavicu u sadržaj tako da server zna u kojem kodiranju je došlo do njega zatražiti zahtjev i uspio je da se ocijeni.
Pripremite podatke potrebne za izvršavanje zahtjeva na poslužitelju. Ako vam ne trebaju nikakvi podaci za izvršavanje na poslužitelju, ovaj korak se može preskočiti.
Stvorite varijablu koja će sadržavati instancu XHR objekta (xmlhttprequest).
Konfigurirajte zahtjev pomoću otvorenog () metode.
Navedeni su sljedeći parametri:
Sadržaj skripte:
// 2. Kreirajte zahtjev za zahtjev \u003d novi xmlhttprequest (); // 3. Postavljanje zahtjeva.Open upit ("get", "obrada.php", true); // 4. Pretplatite se na događaj OnReadyStateChange i obrada ga koristeći anonimnu funkcijsku molbu.AddeventListener ("ReadyStatechange", funkcija () (// ako status traženja 4 ((UK) ako ((UK) IF ((UPIT.ReadyState \u003d\u003d 4) && (UPIT.Status \u003d\u003d 200)) (// Na primjer, povucite objekt XHR na konzolu preglednika Console.log; // i odgovor (tekst), koji je došao sa servera u alert concole.log prozor (upit.Responsetext); // dobiti id \u003d dobrodošli var welcome \u003d dokument.gerentmentbyid ("dobrodošli"); // Zamijenite sadržaj predmeta prema odgovoru koji je došao sa Welcome.Nernerhtml servera \u003d zahtjev.Responsetext; ))); // 5. Slanje zahtjeva zahtjeva.send () poslužitelja;
Kao rezultat toga, datoteka dobrodošlih.html imat će sljedeći kod:
Primjer AJAX-a
Na serveru (pomoću PHP-a):
- Primamo podatke. Ako se podaci šalju putem Get metode, a zatim iz globalnog array $ _get ["ime"]. A ako se podaci prenose pomoću metode post, a zatim iz globalnog porasta $ _POST ["ime"].
- Koristeći ove podatke, izvršite neke akcije na poslužitelju. Kao rezultat toga dobijamo neki odgovor. Povuci ga sa odjekom.
Izrada asinhronog ajax upita (post metoda)
Promijenite gornji primjer. Sada će se Ajax upit na poslužitelj izvoditi nakon pritiska na tipku. Primit će ime koji je ušao u korisnika u ulazni element i pošaljite ga putem post metode na server. Nakon primitka odgovora sa servera, zamijenite ih sadržaj Div elementa na stranici.
Primjer AJAX-a
