JQuery on JavaScript'i raamatukogu, mille eesmärk on "kirjutada vähem, tehke rohkem." Jquery on kohapeal lihtne ühendada ja alustada. Kasutades jquery, muutub JavaScript'i kasutamiseks palju lihtsam.
jQuery kõrvaldab JavaScripti koodi kogu Buzz ja võimaldab teil seda rida rakendada vaid ühes meetodis.
Mis on Ajax?
AJAX on asünkroonne (s.o brauser, taotluse saatmine, võib teha midagi, näiteks näidata sõnumit, mis ootab vastust, kerige lehte jne) JavaScript ja XML. Seda kasutatakse dünaamiliste ja kiirete veebilehtede loomiseks. Ajax võimaldab meil veebilehe osa uuendada ilma kogu lehe taaskäivitamiseta.
Aga jquery ja ajax?
JQuery ja Ajax kombinatsioon pakuvad võimas funktsionaalsust. Alates kasutades jquery. Ja Ajax saate teha taotluse ja saada teavet erinevate formaatide, sealhulgas XML, HTML ja isegi tavaline tekst. Andmete vahetamiseks saate kasutada JSON-vormingut. Ajaxi taotluse saanud andmed saame kasutada meie HTML-leheküljel.
jQuery teeb olemasoleva brauseri Ajax API võimsam ja lihtsam kasutada. Loo Ajax kõned tavalisel viisil, kasutades JavaScripti, natuke raske: kuna peate arvestama, et erinevad brauserid vajavad XMLHTTPRequest objekti loomiseks erinevaid lähenemisviise. Lisaks muutuvad andmete saatmine, näiteks vormidest, muutub raskemaks, kui kasutate Ajaxi helistamiseks tavalist JavaScripti.
jQuery pakub lihtsat ja võimas funktsionaalsust, mis laiendab JavaScripti Ajaxi meetodeid ja annab paindlikuma lähenemise.
Selles väikeses artiklis näen teile kuidas kasutada jquery ja ajax sisse lihtne PHP. vorm. Alustame ... kasutada JQuery ja Ajaxi, me vajame kahte faili, esimene fail sisaldab HTML / PHP koodi, mille Ajax päring koostatakse. Teises faili käigus me tegeleme Ajax päringu ja tagastab tulemus esimesele lehele.
1. samm. Loo kooli.php-fail ja sisestage sellele järgmine kood:
Ülaltoodud koodis me saame õpilase nime ja arvu ja kasutades JQuery ja Ajaxi, saatke need detaile.php.
| SINU NIMI: | ||
| Rulli number: | ||
2. samm: loo details.php ja asetage sellele järgmine kood:
Ülaltoodud koodis saame üliõpilase aadressi, kasutades järjestuse numbrit ja selle nime.
Selle näite puhul peate looma kooli andmebaasi ja õpilaste tabeli. Üliõpilaste tabel sisaldab väljad nimede, järjestuse numbri ja aadressiga.
Loodan, et see artikkel on teile kasulik.
Postitus () meetod on tavaliselt mõeldud andmete edastamiseks serverisse (näiteks vormist).
Postimeetodi kontekstis tasub mainida jSON. - JavaScripti põhivorming. Seda saab kasutada peaaegu iga programmeerimiskeelt.
jQuery, Ajax päringu postitusmeetod
jquery.post (URL ,,,)- Esimene argument (URL) on dokumendi URL, kus taotlus saadetakse;
- Teine argument (andmed) on serverisse saadetud andmed reeglina, mis on esitatud objekti JSina;
- Kolmas argument (tagasihelistamise (Data, TextStatus, JQXHR)) on F-i kutsutud pärast serveri vastust. Argumentidena see funktsioon Võtab serveri saadetud andmed vastuseks taotluse esitamise taotlusele ja staatusele.
json_decode () ja json_encode ()
Sisse pHP keel (5,2), JSON toetus on kaasas kernelis kujul JSON_Decode () funktsioone (dekodeerib JSON string) ja JSON_ENCODE (), mis ise teisendada JSON andmetüübid sobivaks tüübid PHP. ja vastupidi.
1, "B" \u003d\u003e 2); Echo Json_encode ($ ARR); ?\u003e.Tulemus
("A": 1, "B": 2, "C": 3, "D": 4, "E": 5)PHP Näide Operation JSON_Decode
$ JSON \u003d "(" A ": 1," B ": 2)"; Var_dump (JSON_Decode ($ JSON, TRUE)); $ Arr \u003d json_decode ($ JSON, TRUE); ECHO ""$ Arr [" a "]."
"$ ARR [" B "]."
";
Tulemus
Massiiv (5) (["a"] \u003d\u003e INT (1) ["B"] \u003d\u003e INT (2)) 1 2Näide Ajaxi päringu toimimisest postimeetodi abil
Mida me siis teeme:
Kontrollige saadetud saadetud (postituse Ajax) andmete õigsust (kasutaja sisestavad andmed). Kui andmed on õiged, kuvage teade. Vastasel juhul tehke väljadel punane taustvalgustus. Kõik toimib asünkroonselt, st lehekülje taaskäivitamiseta. sa võid kasutada see põhimõteNäiteks, et luua kommentaarisüsteem andmebaasi kommentaaride lisamisega.
jquery.
$ (Dokument) .Veread (funktsioon () (VAR töötamine \u003d FALSE; / * See lipp takistab mitmete kommentaari saatmist: * / $ ("vorm"). Esita (funktsioon (e) (e.preventdefault (); ) Tagasi vale; töötamine \u003d TRUE; $ ("# Esita"). Val ("Oota .."); $ ("viga"). Removeclass ("viga"); $ .Post ("COUNT.PHP", $ (See) .serialize (), funktsioon (MSG) (/ * Saada kuju väärtused esitamata.php: * / töötavad \u003d FALSE; $ ("# Esita"). Val ("Saada"); kui (sõnum. Staatus) // Kui andmed on õiged, lisage sõnum (konsool.log (MSG.STATUS); $ () $ (). InseSebefore ("vorm"). Slaterown ();) muidu (// Kui on vigu, läbida objekti objekti // msg.errors ja võtta need $ .EACH leht (msg.errors, funktsioon (K, V) ($ ("#" + k) .Addclass ( "Viga"); // Alert (K);)));)), "JSON");));));));HTML.
PHP.
// Me aktsepteerime AJAX-i $ Arr \u003d $ _post; $ Arr \u003d $ _post; IF (FILTER_VAR ($ ARROS, FILTER_VALDATE_EMAIL) && Filter_var ($ Arr, filtri_validate_int))))) (ECHO JSON_ENCODE (massiiv ("Status" \u003d\u003e 1 "," HTML "\u003d\u003e"Selles artiklis näited, mida ma kasutan, on saata ajaxi taotlused serverile jquery.. Nende ülesanded võivad olla erinevad, nii et saate kasutada erinevaid funktsioone, mis lihtsustavad kirjutamiskoodi.
HTML-andmete taotlus koormuse funktsiooni abil
See on lihtsaim Ajax päring JQuery kaudu HTML-andmete hankimiseks ja nende sisestamiseks ID \u003d "Tulemusega" (elemendi sisu ").
$ ("# Tulemus"). Koorma ("
Täiendava koormuse versioon:
$ ("# Tulemus"). Koorma ("
Selles näites edastab server ka parameetrid ja pärast vastuse saamist, seda ei kontrollinud, kui viga ei olnud viga (näiteks serveri vastus ei saanud) ja erinevate toimingute tegemine.
Ajaxi taotlused Get and Post Funktsioonid
Need funktsioonid saadetakse Ajax Päringu HTTP-meetodite poolt Saada ja postitada. Ma annan paar näidet nende kasutamisest.
$ .get ("
Andmete edastamine ei ole vajalik, samuti toimingute tegemine pärast serverist vastuse saamist st. \\ t Sellisel juhul saab vajaduse korral vajadusel eemaldada stringid 3 ja 4-6 ja vähendada seega koodi.
Serverist saadud andmete liiki saab määrata datatüübi lisamisega (vt järgmist) - vaikimisi määratakse automaatselt.
Posti kasutamine on sarnane, kuid järgnevas näites kasutan pärast serverilt vastuse saamist funktsioonikõne.
$ .Post ("
Tegelikult on GET-i funktsioonid Ajax funktsiooni lühendatud võimalused, mis kaaluvad allpool.
GetJon JSON andmete saamine
getJson - Ajaxi päringu lühendatud variant, kasutades meetodit ja saavad andmeid AS JSON. Meetod on mugav, näiteks saada mõningaid massiivi andmete ja sellele järgneva tööga.
$ .getjsh (" Serveri poolel moodustab programm massiivi ja teisendab selle näiteks JSON stringile järgmiselt: $ Arr \u003d massiivi (); $ ARR \u003d massiiv ("id" \u003d\u003e 10, "tekst" \u003d\u003e "testjoon 1"); $ Arr \u003d massiiv ("id" \u003d\u003e 20, "tekst" \u003d\u003e "Testliini 2"); $ Arr \u003d massiiv ("id" \u003d\u003e 30, "tekst" \u003d\u003e "Test Line 3"); Echo Json_encode ($ ARR); Samamoodi saab stdclass objekte serverist üle kanda, teisendades need JSON stringile. Nüüd ma annan näite lihtsa saada päringu funktsiooni Ajax ja saada HTML-andmeid. $ .jax (URL: " Taotlus serverisse esineb saada meetodit, sest Parameeter vastutab taotluse tüüpi, vaikimisi tüüp on saada. Näide päringu funktsiooni täitmisest AJAX-i täidesaatvast sündmuste meetodi ja töötlemise postituste edastamisega. Allpool kirjeldan lisavõimalusedmida kõige sagedamini rakendatakse. $ .jax (URL: " Andmeteate nupp:
Näites, kui klõpsate nupul nupule, muutub nupu olek esimestest muudatustest (selle tekst muudab "saatmist ..." ja see muutub aktiivne), mida tehakse Befosendi parameetri abil. Seejärel saadetakse taotlus soovitud andmete edastamiseks. Pärast vastuse vastuvõtmist serverist tagastatakse nupu olek sama (tekst muudatused "Saada", muutub aktiivseks). Vastus saadakse JSON-andmetena. Kirjeldage lühidalt Ajaxi taotluse saatmise parameetreid, mis võivad kõige sagedamini tulla käepärast: Allpool ma annan veel mõned näited Ajax päringute kasutamisest. Proovi HTML-kood:
Lihtne Ajax päring Jquery kaudu Ajax funktsiooni abil
Keerulisem näide AJAX taotluse kaudu jquery
url
Ajaxi taotluse aadressi saatmine
tüüp
Saatmise meetod taotlus saada. või postitus.
andmed.
Andmete saatis andmed. See võib olla string parameetritega ja nende väärtustega par1 \u003d Val1 ja par2 \u003d Val2 & ..., Jquery objekt, näiteks $ ("sisend") või muud andmed.
andmetüüp.
Andmete liik serverist. Võib olla HTML, JSON, tekst, skript ja XML.
vahemälu.
Päringu vahemälu brauseri (False - ei vahemälu).
async.
Asünkroonne päringu täitmine, s.o. Programm teostatakse jätkuvalt ilma serveri vastuse ootamata. Kui täpsustate vale, täidetakse päring sünkroonselt, samas kui leht ei reageeri midagi, kuni vastus serverist vastu võetud.
processData.
URL-vormingusse saadetud andmete teisendamine. Kui on vaja andmeid ei muudeta, paigaldage vale. Näiteks pildi saatmisel serverisse või XML-andmetele.
sisu tüüp.
Tüüp edastatud andmete vaikimisi "rakendus / X-www-vormi-urlencoded; charset \u003d UTF-8". Kui määrate vale, ei edasta pealkiri tüüp, et see võib olla vajalik näiteks pildi saatmisel serverisse.
befosendend.
Enne Ajaxi taotluse saatmist teostatud funktsioon.
täielik.
Pärast serveri vastuse saamist teostatav funktsioon (mis tahes edukas või mitte).
edu.
Eduka päringuga tehtud funktsioon.
viga
Vea korral tehtud funktsioon.
Vormi saatmine kõigi andmete AJAX-i taotlusega jquery kaudu
JavaScripti kood:
$ ("# MyForm"). Esita (E.PreventDefault (e); $ .jax ((tüüp: $ (see) .attr ("meetod"), URL: "
Selleks, et leht taaskäivitatakse, klõpsates nuppu "Saada", tühistage kõigepealt standardse brauseri toimingud e.PreventDefaults () .
Andmeparameetris edastame kõik vormi väljad $ (see) .serialize () - See funktsioon teisendab kõik sisendid ja selec-s stringis, mis sobib serverisse saatmiseks.
Samuti kasutatakse siin parameetrit. async: FALSE. Nii et kui vorm ei lähe serverile, ei saanud midagi muud olla vajutage või teha.
Pildi või Ajaxi päringufaili saatmine jquery kaudu
Faili või pildi saatmise ülesanne serverisse ilma lehte taaskäivitamist üsna sageli esineb. Selles näites on 2 kiibi magaate korraga: valige fail, vajutades nuppumida saab raamida kui soovite ja faili ülekandmisel tehtud edusamme Ajaxi päringu server.
hTML-kood on selline:
#Addfile (positsioon: sugulane; ülevool: peidetud; laius: 180px; kõrgus: 34px;) #load_file (positsioon: absoluutne; ülemine: 0; vasak: 0; kõrgus: 34px; läbipaistmatus: 0px; läbipaistmatus : 0; Filter: alfa (läbipaistmatus: 0);) #load_file: hover (kursor: kursor;)
Idee olemus on see, et standardse sisend kuvatakse nupu peale, et valida fail, kuid see on täiesti läbipaistev ja sellel on samad mõõtmed ühe nupuna. Seega näeb kasutaja nupu nuppu, kuid kui kursor viib selle kaasa, toob tegelikult kaasa sisendile. Seega vajutab nupu vajutamisel tegelikult sisendfaili valiku. Pärast seda, kui faili valimine ei ole kursorit vilkuma, on fondi suurus seatud 0PX-ni.
Nüüd JavaScript Saada Faili koodi serverisse eduaruandega:
$ (Funktsioon () ($ ("# load_file"). Sisse ("Muutus", Loadfile);)); Funktsioon Loadfile () ($ ("Addfile Span"). HTML ("üleslaaditud 0%"); failid \u003d $ ("# load_file"). Failid; var vorm \u003d uus vormdata (); form.Append ("üleslaadimine") , Failid); $ .jax (URL: "
Kui fail on serverisse laaditud, kuvatakse nupule, kui palju% serverisse juba üle kantakse. Pärast allalaadimist on nupu nimi tagastatud, kui see oli ja sisendi väärtus ja fail on tühi, nii et saate uuesti valida uue faili.
PHP serveriosa näide (Eugene taotlusel):
$ sõnum \u003d ""; Kui (tühi (tühi ($ _ faile ["üleslaadimine"] ["NAME"]) || $ _files ["Upload"] \u003d\u003d "Puudub") ($ sõnum \u003d "Sa ei valinud faili";) muidu, kui ($ _Files ["Upload"] ["Size"] \u003d\u003d 0 || $ _files ["Upload"] ["Size"]\u003e 9437184) ($ sõnum \u003d "Faili suurus ei vasta standarditele (maksimaalselt 9 MB) ";) Mujal, kui (($ _files [" üleslaadimine "] [" Type "]! \u003d" Image / JPEG ") && ($ _files [" üleslaadimine "] [" Type "]! \u003d" Image / Pjpeg ") && ($ _files ["üleslaadimine"] ["Type"]! \u003d "Image / GIF") && ($ _files ["üleslaadimine"] ["Type"]! \u003d "Image / PNG")) ($ sõnum \u003d "lubatud Ainult piltide allalaadimiseks jpg, gif ja png. ";) mujal, kui (! is_uploaded_file ($ _ faile [" Upload "] [" tmp_name "])) ($ TMP_NAME"]) ($ sõnum \u003d "Midagi läks valesti. ";) Mujal ($ ftype \u003d $ _files [" üleslaadimine "] [" tüüp "]; $ fname \u003d" Newname_image ". ($ FTYPE \u003d\u003d" Pilt / GIF "?" GIF ": ($ FTYPE \u003d\u003d" Pilt / PNG "?" PNG ":" jpg "); ) ($ sõnum \u003d "edukalt laaditud.";) mujal ($ sõnum \u003d "Midagi läks mitte . Proovige faili uuesti alla laadida. ";)) Välju ($ sõnum);
Teave allalaaditud pildi kohta sisaldub $ _files ["üleslaadimine"], sest Skriptifail lisati järgmiselt: Form.Append (üleslaadimine ", failid); Seega on kõik, mis on PHP programmist nõutav, et kontrollida, kas fail vastab eeldatavatele parameetritele, edastage fail soovitud kaust (Näites failide kausta) all järgmise nime all (Newname_image'i näites) ja tagastage vastus brauserile, mis minu näites kuvatakse lihtsalt kasutaja hoiatusteate (sõnum) käsuga;
Olukorrad, kus saate ja isegi vaja kasutada Ajax päringuid, palju ja kõiki neid siin ei lahti. Siiski, kui on ettepanekuid, siis millised teised näited on mõtet lisada siin, kirjutada kommentaaridesse.
Ma ei saa saata lihtsaim taotlus Servletile jquery abil. Aga samal ajal, kui ma saadan läbi vormi, kõik toimib pauguga. Allpool annan index.html, kust ma soovin kasutaja sisse logida. Login.js, kus taotlus ise, serlettore.java ise servlet ise. Kogu projekti struktuur.
login.js. Ainus vähem töötav URL \u003d "http: // Localhost: 8080 / TESTSERVLET / POST" ja need "/ TestServlet / Post", "TestServlet / Post", "/ Post," Post "põhjustada vea 404.
Funktsioon ADDNEWVOTING () (VAR XHR \u003d uus XMLHTPequest (); VAR Body \u003d "Nimi \u003d" + kodericomponent (nimi ") +" ja perekonnanimi \u003d "+ kodericomponent (" perekonnanimi "); xhr.open (" Post "," aadress Funktsioon ADDNEWVOTING1 () ("VAR kasutaja \u003d (" Firstname ":" Vlad ") VAR JSONING \u003d JSON.STRING (kasutaja); VAR URL \u003d" http: // Localhost: 8080 / TestServlet / Post "; $ .jax ((URL) : URL, meetod: "Post", Andmed: jsingering, contentType: "Application / JSON", viga: funktsioon (sõnum) (sõnum) (sõnum); konsool.log (jsonobject);), edu: funktsioon (andmed) (var JSONOBJECT \u003d JSON.PARSE (andmed); konsool.log (JSONObject);), päised: ("Nõustu": "Application / JSON", "aktsepteeri-keel": "en", "vahemälu-kontroll": "Max- Vanus \u003d 3600 ")););
Teise funktsiooni kutsumisel kuvab see:
index.html
ServletStore.java.
Import Javax.Servlet.Servlexception; Import Javax.Servlet.annotation.webServlet; Import Javax.Servlet.http.htpingervlet; Import Javax.Servlet.http.httpservletrequest; Import Javax.Servlet.http.httpservleTesponse; Import java.io.IoException; Import Java.io.Printwriter; @WebServlet (nimi \u003d "Post" Prindi (helilo ");) @override kaitstud void dopost (httpservletrequest req, httpservleTesponse resp) viskab servlexception, ioException (SUPPDOPOST (req);))
Projekti struktuur.
Õppetund, kus näidetes kaalutakse lihtsa asünkroonse Ajaxi taotluste loomist serverisse. Taotluste edastamise meetodina kasutame nii saada meetodit kui ka postimeetodit. Serveris käivitate PHP-skriptide kasutamisel taotlusi.
Mis on Ajax asünkroonne taotlus?
Ajaxi tehnoloogiat kasutatakse peamiselt asünkroonsete taotluste loomiseks serverisse. Asünkroonne päring on selline taotlus, mis toimub taustal ja ei takista kasutajal lehel suhtlemist.
Asünkroonse taotluse saatmisel ei ole brauser (leht) "külmutatud", st Mis sellega nagu enne, saate töötada. Aga siis, kuidas teada saada, millal vastus serverist pärineb. Selle määramiseks peate jälgima valmiste brauseri vara (valmisoleku seisund). See majutusasutus sisaldab numbrit, mille võrra saab hinnata, millises etapis on uurimine. Järgmises tabelis on esitatud valmisomandi ja vastavate riikide põhiväärtused.
Need. Tuleb välja, et me peame jälgima, millal valmistatava vara väärtus on võrdne 4. See tähendab, mida server vastas saadetudle. Ülejäänud väärtused praktikas kasutatakse üsna harva ja mõned brauserid ei pruugi neid toetada.
Selleks, et teha kindlaks, millises etapis päringut peate kasutama XMLHTTPequest OrydeystateChange objekti. See sündmus ilmneb iga kord, kui valmisomadusomaduste väärtus muutub. Sellest tulenevalt saate selle ürituse käitleja (lamatud või nimega funktsioon) käitleja registreerida meetmeid, mis kontrollivad, kas see vara 4 on võrdne ja näiteks väljundserveri vastus lehele.
Asünkroonse Ajaxi päringu loomine (Get meetod)
Kaaluma asünkroonse loomist Ajaxi taotlus Näitel, mis on pärast allalaadimist kasutajale tervitamiseks ja selle IP-aadressi allalaadimiseks.
Selleks peate seadistama serveris 2 faili ühes kataloogis:
- wELITER.HTML - HTML-leht, mis kuvatakse kasutajale. Samal lehel pange skript, mis viib läbi kõik vajalikud tegevused Ajaxi töö kliendi poolel.
- processing.php - PHP-fail, mis töötleb serveri poolel taotluse ja vormib vastuse. Alustame arendada loomisest põhistruktuuri Welcome.html faili
Ajaxi näide
Kaaluge kliendi poolel toimuvate toimingute jada (JavaScripti koodis):
- Meetod, mis saadetakse serverisse (saada, post).
- URL-i, mis töötleb serveri taotlust.
- Taotle tüüp: sünkroonne (False) või asünkroonne (TRUE).
- Nimi ja parool vajadusel.
Telli XHR objekti OrgayStateChange'i sündmus ja juhib tähelepanu käitlejale anonüümseks või nimega funktsiooniks. Pärast seda luua koodi selles funktsioonis, mis kontrollib vastuse staatust ja teostada teatud sammud lehel. Vastus, mis pärineb serverist on alati vastutustuba vara.
Lisaks saab readyState vara number 4 kehtiva väärtusega kontrollida staatuse vara väärtust. See vara määrab päringu staatuse. Kui see on 200, siis kõik on korras. Vastasel juhul ilmnes viga (näiteks 404 - URL-i ei leitud).
Me saadame serverile taotluse Saada () meetodi abil.
Kui kasutate päringu saatmise meetodit, edastage andmed parameetrile see meetod ära. Need edastatakse URL-i osana.
Kui kasutate päringu saatmiseks postimeetodit, tuleb andmed edastada parameetrina, kasutades Saada () meetodit. Lisaks peate enne selle meetodi helistamist installima sisutüüpi päise nii, et server teab, millises kodeeringusse tema taotlus ja suutis seda dešifreerida.
Valmistage vajalikud andmed serveris taotluse täitmiseks. Kui te ei vaja serveris käivitamist andmeid, saab seda sammu vahele jätta.
Loo muutuja, mis sisaldab näiteks XHR objekti (XMLHTTPRequest) eksemplari.
Konfigureerige taotlus avatud () meetodi abil.
Määratletakse järgmised parameetrid:
Skripti elemendi sisu:
// 2. Looge päring var päring \u003d uus XMLHTTPRequest (); // 3. Päringu seadistamine.Open päring ("Get", "Processing.php", Tõsi); // 4. Telli OrcydeadstateChange sündmus ja töötlemine, kasutades anonüümset funktsiooni päringut 4) && (päring \u003d.Status \u003d\u003d 200))) (// Näiteks tühistage XHR-objekti konsoolisse XHR-objekti. aken (päring.responsetext);); // 5. Taotluse saatmine päringule.Send () server;
Selle tulemusena on Welcome.html failil järgmine kood:
Ajaxi näide
Serveril (PHP kasutamine):
- Me saame andmeid. Kui andmed saadetakse saada meetodi kaudu, siis ülemaailmsest massiivi $ _get ["NAME"]. Ja kui andmed edastatakse postimeetodi abil, siis ülemaailmsest massiivist $ _POST ["NAME"].
- Selle andmete kasutamine käivitage serveris mõned tegevused. Selle tulemusena me saame vastuse. Selle ECHO-ga tagasi võtta.
Asünkroonse Ajaxi päringu loomine (postimeetod)
Muuda ülaltoodud näidet. Nüüd teostatakse Ajax päring serverisse pärast nupu vajutamist. Ta saab nimi, mis sisestati kasutaja sisestusseadmesse ja saadab selle serveri postimeetodi kaudu. Pärast serverivastuse saamist asendage need leheküljel asuva divielemendi sisu.
Ajaxi näide
