Ajax - eksempler. Ajax-scripts

Internettet giver den besøgende synligheden af hver ressource, der hostes i et netværk, og browser - adgang via netværksprotokoller, call mekanismer enkelte scripts, transmission / modtagelse af information. Sæt af sider, der udgør webstedet, har en fælles rod - et unikt link (domænenavn, en unik knude adresse).

Ligegyldigt ressourcen reagerer at besøge statisk eller dynamisk genererer et svar. Selv om formen og indholdet af de sider, afhænger af eventuelle betingelser, udelelig enhed af kommunikation server og klienten (browseren) er det færdige HTML-kodet dokument, billeder, style sheets, og andre filer nødvendige indhold og miljø. Hvis der er noget galt, viser browseren alle, der er "styret" for at få parse og udføre.

Mange lovende teknologier er dukket op i lang tid, men er blevet uretfærdigt glemt eller ikke er blevet anvendt korrekt. Først AJAX (eksempler bruger XMLHttpRequest objekt) optrådte for mange år siden, men den succes og berømmelse kom langt senere.

Alle eller kun hvad du har brug for

I den klassiske version af hjemmesiden - navnet, IP-adresse og et link (alle synonymer, der betegner det samme punkt på internettet rum). Hvad ligger der bag denne hovedside - tænkte: på eget initiativ en moderne "designer", som ikke engang spørge, hvorfor det er så? Hvorfor webstedet er den vigtigste side, hvorfra du kan komme til nogen anden? Denne mulighed - tydeligvis ikke ideel, det er det konkrete indhold og den faktiske funktionalitet.

Kort sagt, hvis en person har brug for en tandlæge, det er den rigtige adresse til et bestemt formål, snarere end til køkkenet til operation og ikke til biblioteket til høring terapeut. På det sted, hvor denne ene viste sig, ser han, men ikke modtager en tandklinik i fuldt omfang. Det bedste, der kan forvente en besøgende - registreringsdatabasen og retningen (den nøjagtige sti) til lægen. Og på stedet (ved ankomst) kan ændre sig som læge, og destination.

Men her er det sted normalt altid lagt i fuld ammunition, intet ændrer ved lastning, under hensyntagen til den tid, at nogen er kommet ... Men selv i det tilfælde, hvor det er en virkelige liv klinik, første gang du besøger en ny kunde til at give tilstrækkelig information side , kontakter, og ... vinduet registreringsdatabasen kan fastsættes, at besøg på stedet blev gjort under off-timer, som foreskrevet af lægen ikke er til rådighed, en midlertidig ansættelse er lavet i et andet kontor ...

Point i Internet rummet

Den klassiske reaktion af ressourcen af internettet rum - som svar på en anmodning om at udstede et site side (som regel hjem), og derefter den anden, på anmodning af den besøgende. Site Server indeholder også billeder, stilarter, JavaScript-kode scripts, PHP, etc. Ikke alle PHP-filer gør sider, nogle af dem kan reagere på AJAX anmodninger :. at modtage, behandle og sende information.

Skriv et script et snuptag. Men at komme til det punkt af kontrol på internettet rum, er det umuligt at afgøre, hvem og hvorfor stilet, der aktiveres er navnet, IP-adresse og link. Enhver bevægelse på netværket foregår i software, primært gennem en browser, men også gennem robotter af forskellig oprindelse og destination gennem andre steder af handling.

Script, få kontrol, kan præcist kender kun: et besøg gennem hvilken browser den besøgende kom, med en henvisning fra hvilke IP-adresser, og tilstedeværelsen af cookies. Kun sidstnævnte kan give oplysninger, at de danner hovedsiden, men kun hvis den besøgende allerede har været her. I alle andre tilfælde er det muligt at generere kun den generelle svar fra serveren. AJAX-eksempler, der er nemme at finde på internettet, bør anvendes med omhu. Fejl i (brug) af XMLHttpRequest objekt til at spore er ikke let.

Den overordnede reaktion og den private dialog

Det overordnede svar fra serveren - en fælles side, kaldet hovedstolen af det, der kaldes indekset, og det begynder med et websted, der er i modstrid med dens tilknytning til de andre sider tilgængelige. Men hvis den besøgende kender navnene på de andre sider, de er i hans forståelse bliver ikke mindre vigtig end den ene, der er udpeget udvikler. Her er den klassiske model, alle på en gang: det overordnede design og funktionalitet, der fokuserer på alle besøgende.

Privat dialog - en fortsættelse af den foregående session af den besøgende. Sitet allerede ved, hvad han gjorde, at han var interesseret i, hvad der blev set side og sætte det i hans hukommelse, skrev noget i browser cookies.

Det plejede to grundlæggende anmodning til serveren for at hente webstedet og arbejde sammen med ham: POST og GET. forespørgslen resultatet er en hel side. På den side, kan den besøgende aktivering af disse eller andre begivenheder, der er konfigureret på virkningen af visse sideelementer.

Begivenheder sideelementer

sideelement kan være nøglen til at finde oplysninger, mening - at tage indholdet af et tekstfelt, og opdager, at det skrev en besøgende. Arrangementet kan opstå på et menupunkt, billede, tekstfelt. Under alle omstændigheder vil JavaScript-funktion køres, som kan udføre AJAX-anmodning på følgende måde:

InitXML ( '../ Mphp / scSrvPhpWord.php? CTask = GoPage' + '& cOwnerCode =' + cOwnerCode
+ '& CSessionCode =' + cSessionCode + '& cActiveItem =' + cActiveItem);

Således InitXML () funktion er defineret som følger (variablen var scXHR beskrives uden for funktionen):

funktion InitXML (scURL) {

scXHR = null;

hvis (window.XMLHttpRequest)
{prøv
{ScXHR = ny XMLHttpRequest ();
} Catch (e) {}
} else
hvis (window.ActiveXObject)
{prøv
{ScXHR = ny ActiveX-( 'Msxml2.XMLHTTP');
} Catch (e)
{prøv
{ScXHR = ny ActiveX-(Microsoft.XMLHTTP ');
} Catch (e) {}
}
}
hvis (scXHR)
{
scXHR.open ( 'GET', scURL);
scXHR.onreadystatechange = WaitReplySC;
scXHR.send (null);
};
}

Denne funktion tager en URL og initierer en anmodning om det. Asynkron svar vil komme så snart vil opfylde scriptet angivet i URL'en (i dette tilfælde - scSrvPhpWord.php, beliggende i ../Mphp/ mappe i forhold til roden af sitet), og vil begynde WaitReplySC () funktion, som går til indgangen på den server, XML-svar, inklusive titel og indhold.

serversvar

Faktisk serveren er en PHP-script - et program, der begynder med installationen af de væsentlige betingelser, hente de nødvendige faciliteter, forbehandling, som afhænger af bygherren formål:

namespace PhpOffice \ PhpWord;

ini_set ( 'display_errors', 1);
error_reporting (E_ALL ^ E_NOTICE);

ignore_user_abort (sand);
set_time_limit (12);

bruge PhpOffice \ PhpWord \ MphpObj \ scDocuments;

require_once 'PhpOffice / PhpWord / Autoloader.php';
\ PhpOffice \ PhpWord \ Autoloader :: register ();

Repræsenteret begyndelsen af et mærke, der angiver eventuelle fejl, forbyder at stoppe et script, når brugeren logger af og sætter en frist på at udføre tilfælde loop - 12 sekunder. Næste link library PhpOffice \ PhpWord efter dokumenter * .docx.

Som vist ovenfor AJAX-opkald ( '... cTask = GoPage' + '& cOwnerCode =' + cOwnerCode + '& cSessionCode =' + cSessionCode + '& cActiveItem =' + cActiveItem) - de fire GET-variabler, som måske eller måske ikke være, bør tjekke deres faktiske ledighed:

$ CTask = (isset ($ _ GET [ 'cTask']))? $ _GET [ 'cTask']: '';
$ COwnerCode = (isset ($ _ GET [ 'cOwnerCode']))? $ _GET [ 'cOwnerCode']: '';
$ CSessionCode = (isset ($ _ GET [ 'cSessionCode']))? $ _GET [ 'cSessionCode']: '';
$ CActiveItem = (isset ($ _ GET [ 'cActiveItem']))? $ _GET [ 'cActiveItem']: '';

Efter udførelse af forberedende foranstaltning scriptet beslutter:

kontakt ($ cTask) {

tilfælde 'GoPage': // (dette er en udfordring i den første download eller opdatere siden)

$ COwnerCode = 'cOwner';
$ CSessionCode = 'cSession';
$ CContents = 'cContents';
$ CStatus = 'cStatus';
$ CHTML = iconv ( 'UTF-8', 'CP1251', 'kodende element ");
$ CActiveItem = iconv ( 'UTF-8', 'CP1251', 'variable');

$ CReply = "scSrvRM | GoPage | sæt | {$ cOwnerCode}` {$ cSessionCode} | {$ cContents} `{$ cStatus} | {$ CHTML} | {$ cActiveItem}";

break;

}

og den sidste del af scriptet:

header ( "Content-Type: text / xml; acceptere-charset = utf-8");
header ( "Cache-Control: no-cache");
echo '';
$ CReply = iconv ( 'CP1251', 'UTF-8', $ cReply); // konvertering fra 'CP1251' in 'UTF-8'
echo $ cReply;

At få kunden svar

På den side, der er indlæst i browseren, blev det konstateret, at så snart serveren vil forberede et svar, vil det blive behandlet funktion WaitReplySC:

fungere WaitReplySC () {

try {

hvis (scXHR.readyState == 4) {
hvis (scXHR.status == 200) {// responsbehandlingssystem

var TestReply = scXHR.responseText;

if ((TestReply.indexOf ( 'Fortolkningsfejl')> 0) ||
(TestReply.indexOf ( 'meddelelsen')> 0)) alert (scXHR.responseText);

var CDATA = scXHR.responseText;
var ADATA = cData.split ( '|');

var CCMD = ADATA [1];
var cPos = ADATA [2];
var aOwnerSession = ADATA [3] .split ( '`');
cOwnerCode = aOwnerSession [0];
var cSessionCode = aOwnerSession [1];
var aContentStatus = ADATA [4] .split ( '`');
var cContent = aContentStatus [0];
var cStatus = aContentStatus [1];
var cHTML = ADATA [5]; // server HTML-svar
Var cVarValues = ADATA [6]; // variabler for Forms

kontakt (CCMD) {

tilfælde 'GoPage':

var dTestLine = document.getElementById (scTestLine ');
dTestLine.innerHTML = 'Svar = [' + cOwnerCode + ''
+ CSessionCode + ''
+ CContent + ''
+ CStatus + ''
+ CHTML + ''
+ CVarValues + ']';

break;
}

} Else {
. Document.getElementById ( 'scAreaStatus') innerHTML = "Fejl !!!";
}
}
} Catch (e) {}

}

Ved anvendelse AJAX-eksempler er siden indlæst i browseren opnå (i scTestLine element):

Svar = [cOwner, cSession, cContents, cStatus, kodende element, variabler]

På repræsentation af koden, jQuery og WordPress

Side i browseren og scriptet tekst skrevet i UTF-8, til brug iconv () funktion til at konvertere russiske tegn. Resten af skelettet er repræsenteret ved kode er meget simpel og let kan gentages til et bestemt formål.

Med forbehold for ændringer kun i WaitReplySC () funktion og den faktiske script-kode, der genererer svaret behandling serversvar. Opkald InitXML funktion (en bestemt scURL og relevante data til det) er placeret i tilfælde håndterer på side elementer og definere betydningen af disse elementer.

Præsenteret eksempler på AJAX-orienterede til "manuel" brug af teknologi.

I forskellige content management system (SMS) kapaciteter er beskrevet på forskellige måder, som regel, i stil med en bestemt specificitet. For eksempel er jQuery AJAX opkaldsmuligheder realiseret jQuery.ajax () fungerer i enten et højere niveau: jQuery.get () og jQuery.post (). Parameteren overføres url og indstillinger (sæt centrale + værdi par). jQuery.ajax () returnerer XMLHttpRequest-objekt.

JQuery at spore resultaterne af de foreslåede funktion-metoder: XHR.done () - den vellykkede gennemførelse af anmodningen. XHR.fail () - fejlhåndtering.

jqXHR.done () metode yavlyatsya alternativ handleren vellykket gennemførelse af AJAX-anmodning. Erstatter forældet jqXHR.success () metode.

Tilsvarende er anvendelsen af på Wordpress AJAX-teknologi. Her har alt implanteret sig i content management system, behøver du kun at bruge den foreslåede struktur. Dokumenterne leveres en detaljeret beskrivelse.

AJAX Ansøgning afhænger hovedsageligt af de valgte værktøjer, selvom den manuelle version kan anvendes parallelt eller i tillæg til den valgte content management system, den ene eller anden version af jQuery. Sidstnævnte er nyttigt at arbejde på egen hånd, fordi næsten alle moderne sms bruge det, men hver på sin måde.

Et klassisk eksempel på anvendelsen af

Enkel og eksponentiel brug af AJAX - Kurv online butik. gemme sider er altid fyldt med varer, selv om de i virkeligheden måske ikke. Genindlæsning normalt tager lang tid, men når en besøgende vælger et produkt, kan han altid bare give op på ham eller ændre den udvalgte, at webstedet er altid ønskeligt at vise hurtigt.

Normalt er det realiseret i form af kurve og mærker omkring udvalgte emner. Uden brug af AJAX dynamiske ændringer til disse elementer er problematisk.

AJAX-scripts, der implementerer mekanismer til at tilføje / fjerne elementer i din indkøbskurv, blev de facto i mange SMS.

Til normal datatransmission via AJAX form kan dannes på konventionel måde (til indtastning af navn og password):