muzruno.com

Аякс са примери. Аякс скриптове

Интернет предоставя на посетителите на видимостта на всеки ресурс, който се хоства в мрежа, и браузър - достъп чрез протоколи, механизми за обаждания на отделните скриптове, предаване / приемане на информация. Наборът от страници, които съставляват сайта, има общ корен - уникална връзка (име на домейн, уникален адрес на възел).

Няма значение дали ресурсът реагира на посещение статично или създава динамичен отговор. Дори и на формата и съдържанието на страниците зависи от никакви условия, неделима единица комуникационен сървър и клиент (браузър) е завършен HTML кодирани документ, изображения, стил листове и други файлове, необходимо съдържание и околната среда. Ако нещо не е наред, браузърът показва всичко, което е "успял" да се направи разбор и изпълнение.

ajax примери

Много обещаващи технологии се появяват от дълго време, но са незаслужено забравени или не се използват правилно. Първият AJAX (примери за използване на обекта XMLHttpRequest) се появи преди много години, но успехът и славата дойдоха много по-късно.

Всички наведнъж или точно това, от което се нуждаете

В класическата версия на сайта - името, IP адреса и връзката (всички са синоними, обозначаващи една и съща точка в Интернет пространството). Фактът, че това е основната страница на сайта - по своя собствена инициатива си помисли за модерен "разработчик", който дори не си зададе въпроса: защо точно? Защо сайтът е основната страница, от която можете да стигнете до други? Тази опция очевидно не е такава идеален, това конкретно съдържание и действителна функционалност.

jquery ajax

Просто казано, ако човек се нуждае от зъболекар, той отива на правилния адрес за определена цел, а не в кухнята за хирургическа интервенция, а не в библиотеката за консултиране с терапевт. На място, където се е случило този човек, ще види, но няма да получи пълна стоматологична поликлиника. Максимумът, по който посетителят може да разчита, е регистърът и посоката (точния път) към лекаря. И на място (при пристигане) може да промени лекаря и дестинацията.

Но тук е мястото обикновено винаги заредена напълно боеприпаси, нищо не се променя при натоварване, като се има предвид времето, че някой е дошъл ... Но дори и в случаите, когато това е клиника за реалния живот, за първи път, когато посетите нов клиент да се даде достатъчно информация на страницата , контакти и ... регистър на прозореца може да се осигури, че при посещението на обекта е било направено по време на почивни часа, както е предписано от лекар не е на разположение, за временно назначение се прави по различен офис ...

Посочете в Интернет пространството

Класическият отговор на ресурса на интернет пространството - в отговор на искане за издаване на страницата на сайта си (обикновено у дома), а след това от друга страна, по искане на посетителя. Site сървър също така съдържа изображения, стилове, jаvascript код скриптове, PHP и т.н. Не всички PHP файлове правят страници, някои от тях може да отговори на исканията на AJAX :. да получава, обработва и изпраща информация.

Не е трудно да напишете сценарий. Но да се достигне до мястото за контрол в интернет пространството, не е възможно да се определи кой и по каква причина, адресирано, който се активира, е името, IP-адрес и връзката. Всяко движение в мрежата се осъществява в областта на софтуера, най-вече през уеб браузър, но и чрез роботи с различен произход и дестинация чрез други сайтове на действие.

Сценарий, да поеме контрола, може точно да знаете само: посещение през браузъра, дойде посетителя, с данни, чрез които IP адреси, както и наличието на бисквитки. Само последният може да даде информация за това как да се оформи основната страница, но само ако този посетител вече е бил тук. Във всички други ситуации е възможно да се генерира само общият отговор на сървъра. AJAX - примери, които лесно се намират в интернет, трябва да се използват внимателно. Грешките в операцията (използването) на обекта XMLHttpRequest са трудни за проследяване.

Обща реакция и частен диалог

Повлияването от сървъра - обща страница, по-нататък главницата на това, което се нарича индекса, и то започва с един сайт, който е в противоречие с неговите връзки към други страници на разположение. Въпреки това, ако посетителят знае имената на тези други страници, те в своето разбиране няма да бъдат по-малко важни от определените от разработчика. Така че изглежда като класически модел, всичко наведнъж: общ дизайн и функционалност, насочени към всички посетители.

Частният диалог е продължение на предходната сесия на посетителя. Сайтът вече знае какво е направил, че той се интересува от това, което бе разгледана страница и я сложи в паметта му, пише нещо в кукитата в браузъра ви.

Има две основни искания към сървъра за изтегляне на сайта и работа с него: POST и GET. Резултатът от заявката е цялата страница. На получената страница посетителят може да активира определени събития, конфигурирани за действия по определени елементи на страницата.

WordPress Аякс

Събития на елемент от страницата

Елементът на страницата може да бъде бутон за намиране на информация, т.е. да вземе съдържанието на текстовото поле и да открие какво е написал го посетителят. Събитие може да се случи на елемент от менюто, картина, текстово поле. Във всеки случай ще се стартира jаvascript функция, която може да изпълни заявката AJAX, както следва:

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

Функцията InitXML () се дефинира по следния начин (променливата var scXHR трябва да бъде описана извън функцията):

функция InitXML (scURL) {

scXHR = null-

ако (window.XMLHttpRequest)
{опитате
{scXHR = нов XMLHttpRequest () -
} улов (д) {}
} друго
ако (window.ActiveXObject)
{опитате
{scXHR = нов ActiveXObject ("Msxml2.XMLHTTP") -
} улов (д)
{опитате
{scXHR = нов ActiveXObject ("Microsoft.XMLHTTP") -
} улов (д) {}
}
}
ако (scXHR)
{
scXHR.open (`GET`, scURL) -
scXHR.onreadystatechange = WaitReplySC-
scXHR.send (null) -
} -
}

Тази функция може да отнеме един URL и инициира искане за това. Asynchronous отговор ще дойде веднага след като ще изпълни сценария, посочен в адреса (в този случай - scSrvPhpWord.php, намиращ се в ../Mphp/ папка спрямо корена на сайта) и ще започне WaitReplySC () функция, която отива на входа на сървъра XML-отговор, включително заглавието и съдържанието.

кошница ajax

Отговор на сървъра

Самият сървър е PHP скрипт - програма, която започва с инсталирането на основни условия, изтеглянето на необходимите съоръжения, предварителното обучение, което зависи от целите на разработчика:

името пространство PhpOffice PhpWord-

ini_set (`display_errors`, 1) -
error_reporting (E_ALL ^ ​​E_NOTICE) -

ignore_user_abort (true) -
set_time_limit (12) -

използвайте PhpOffice PhpWord MphpObj scDocuments-

require_once `PhpOffice / PhpWord / Autoloader.php`-
PhpOffice PhpWord Autoloader :: register ();

Представеното начало показва знакът на всички грешки, забранява спирането на скрипта, когато потребителят е изключен, и задава границата на изпълнение за случая на верига - 12 секунди. След това библиотеката PhpOffice PhpWord е свързана с работа с документи * .docx.

Както е показано по-горе AJAX-предизвикателство ( "... cTask = GoPage `+` cOwnerCode = `+ cOwnerCode +` cSessionCode = `+ cSessionCode +` cActiveItem = `+ cActiveItem) - това GET-четири променливи, които не могат да бъдат трябва да проверите тяхната актуална наличност:

$ cTask = (isset ($ _GET [`cTask`])))? $ _GET [`cTask`]: `` -
$ cOwnerCode = (isset ($ _GET [`cOwnerCode`])))? $ _GET [`cOwnerCode`]: `` -
$ cSessionCode = (isset ($ _ GET [`cSessionCode`])))? $ _GET [`cSessionCode`]: `` -
$ cActiveItem = (isset ($ _ GET [`cActiveItem`])))? $ _GET [`cActiveItem`]: ``;

След извършване на подготвителните действия скриптът взема решение:

превключвател ($ cTask) {

случай "GoPage": // (това е обаждане, когато страницата първоначално е заредена или обновена)



$ cOwnerCode = `Коучър`
$ cSessionCode = `cSession`-
$ cContents = `cContents`-
$ cStatus = `cStatus`-
$ cHtml = iconv (`UTF-8`, `CP1251`, `кодиране на елемент`) -
$ cActiveItem = iconv ("UTF-8", "CP1251", "променливи стойности");

$ CReply = "scSrvRM | GoPage | набор | {$ cOwnerCode}` {$ cSessionCode} | {$ cContents} `{$ cStatus} | {$ CHTML} | {$ cActiveItem}" -

прекъсване;

}

и последната част на сценария:

заглавие ("Тип съдържание: текст / xml-accept-charset = utf-8") -
header ("Кеш-контрол: не-кеш") -
echo `$ cReply = iconv (`CP1251`, `UTF-8`, $ cReply) - // преобразуване от `CP1251` на `UTF-8`
echo $ cReply;

Получаване на отговор от клиента

На страницата, изтеглена в браузъра, бе определено, че след като сървърът е подготвил отговор, той ще бъде обработен от функцията WaitReplySC:

функция WaitReplySC () {

опитайте {

ако (scXHR.readyState == 4) {
ако (scXHR.status == 200) {// обработваме отговора

var TestReply = scXHR.responseText-

ако ((TestReply.indexOf ("Parse error")> 0) ||
(TestReply.indexOf ("Съобщение")> 0)) сигнал (scXHR.responseText) -

var cData = scXHR.responseText-
var aData = cData.split (`|`) -

var cCmd = aДата [1] -
var cPos = aДата [2] -
var aOwnerSession = Данни [3] .split (```) -
cOwnerCode = aOwnerSession [0] -
var cSessionCode = aOwnerSession [1]
var aContentStatus = aДата [4] .split (`` `) -
var cContent = aContentStatus [0] -
var cStatus = aContentStatus [1] -
var cHTML = aData [5] - // HTML отговор на сървъра
var cVarValues ​​= aData [6] - // стойности на променливите за формуляри

превключвател (cCmd) {

случай "GoPage":

var dTestLine = document.getElementById (`scTestLine`) -
dTestLine.innerHTML = `Отговор = [` + cOwnerCode + `,`
+ cSessionCode + `,`
+ cContent + `,`
+ cStatus + `,`
+ cHTML + `,`
+ cVarValues ​​+ `]` -

брейк
}

} else {
document.getElementById (`scAreaStatus`) innerHTML = "Грешка !!!"
}
}
} улов (д) {}

}

По този начин, използвайки тези примери AJAX, при зареждането на страницата в браузъра получаваме (в елемента scTestLine):

Отговор = [cower, cSession, cContents, cStatus, кодиране на елемент, стойности на променливи]

За подадения код, jQuery и WordPress

Страницата в браузъра и текста на скрипта са написани с кодиране UTF-8, поради което функцията iconv () се използва за конвертиране на руски букви. В противен случай, скелетът на представения код е много прост и може лесно да бъде повторен за конкретна цел.

Само обработката на отговор на сървъра във функцията WaitReplySC () и действителният код на скрипта, който формира този отговор, подлежат на промяна. Покани функция InitXML (за определен scURL и съответните данни за него) са поставени в обработват събитие на елементи на страницата и да се определи значението на тези елементи.

Представените AJAX-примери са насочени към "ръчното" използване на технологията.

В различните системи за управление на сайта (SMS), описаните възможности са представени по различни начини, обикновено в стила на една или друга специфичност. Например, JQuery AJAX възможности за обаждания са реализирани jQuery.ajax () функции в един по-високо ниво: jQuery.get () и jQuery.post (). Параметърът се предава на url и настройки (набор от двойки ключ-стойност). jQuery.ajax () връща обект XMLHttpRequest.

ааакс скриптове

За да проследите резултата, jQuery предлага функционални методи: XHR.done () - успешно завършване на заявката. XHR.fail () - работа с грешки.

Методът jqXHR.done () е алтернатива на манипулатора за успешното завършване на заявката AJAX. Заменя остарелия метод jqXHR.success ().

напишете скрипт

По същия начин използването на технологията AJAX върху WordPress. Тук всичко е вече имплантирано в самата система за управление на сайта, само трябва да използвате предложените дизайни. В документацията се предлага подробно описание.

AJAX Application зависи основно от избраните методи, въпреки че ръководството версия може да се използва паралелно или в допълнение към избраната система за управление на съдържанието, на една или друга версия на JQuery. Последното е полезно да се работи самостоятелно, защото почти всички съвременни SMS го използват, но всеки по свой собствен начин.

Класически пример за приложение

Едно просто и примерно приложение на AJAX е пазарска количка в онлайн магазин. Страниците на магазина винаги са пълни с стоки, въпреки че в действителност те не могат да бъдат. Презареждането обикновено отнема доста време, но когато посетителят избира един продукт, той винаги може просто да се откажем от него или да промените избраникът, че сайтът винаги е желателно да се покаже бързо.

ajax форма

Обикновено това се осъществява под формата на кошница и маркира в близост до избраните стоки. Без използването на AJAX, динамичната промяна в тези елементи е проблематична.

AJAX скриптовете, които прилагат механизмите за добавяне / изваждане на стоки към кошницата, са станали фактически в много SMS.

За нормално предаване на данни чрез AJAX формулярът може да се изпълнява по обичайния начин (за въвеждане на име и парола):



Влезте

Тук е поддръжникът:

функция scfWelcomeGo () {

var cName = document.fWelcome.cName.value-
var cPass = document.fWelcome.cPass.value-

InitXML (`../ Mphp / scSrvPhpWord.php? CTask = CheckWelcome`
+ `cName =` + cName
+ `cPass =` ​​+ cPass)

}

изпраща до сървъра, за да потвърди въведеното от посетителя име и парола. Сценарият проверява получената информация в таблицата с потребител и изпраща обратно отговор въз основа на което съответният скрипт показва съобщение на страницата (извършва действие) за регистрирани потребители, или съобщения, че няма такъв потребител и трябва да бъдат регистрирани.

Споделяне в социалните мрежи:

сроден