Ajax - exemplos. guións de Ajax

A Internet ofrece ao visitante a visibilidade de cada recurso que está aloxado nunha rede e navegador - acceso a través de protocolos de rede, mecanismos de chamada de guións individuais, transmisión / recepción de información. Un conxunto de páxinas que compoñen o sitio web, ten unha raíz común - unha ligazón único (nome de dominio, un único enderezo de nó).

Non importa o recurso responde a visitar estática ou dinámica xera unha resposta. Aínda que a forma eo contido das páxinas depende de calquera condicións, a unidade indivisible de servidor de comunicación e que o cliente (navegador) é o documento final con código HTML, imaxes, follas de estilo e outros arquivos de contido e ambiente necesario. Se algo está mal, o navegador exhibe todo o que é "xestionado" para conseguir analizar e realizar.

Moitas tecnoloxías prometedoras xurdiron por un longo tempo, pero foron inxustamente esquecido ou non fosen utilizados adecuadamente. Primeiro AJAX (exemplos usan o obxecto XMLHttpRequest) apareceu hai moitos anos, pero o éxito e fama veu moito máis tarde.

Todos ou só o que precisa

Na versión clásica do sitio - o nome, o enderezo IP e un enlace (todo Sinónimos que designan o mesmo punto no espazo Internet). O que está detrás desta páxina principal - pensei: por iniciativa propia un "deseño" moderna, que nin sequera preguntar por que é así? Por que a web é a páxina principal a partir do cal pode chegar a calquera outra? Esta opción - claramente non ideal, é o contido específico ea funcionalidade real.

Simplificando, se unha persoa ten que un dentista, é a dirección axeitado para unha finalidade específica, en vez de para a cociña para a cirurxía e non para a biblioteca para o terapeuta consulta. No lugar onde este acabou, el ve, pero non recibe unha clínica dental na súa totalidade. O mellor que podemos esperar un visitante - o rexistro ea dirección (o camiño exacto) para o médico. E no lugar (na chegada) pode cambiar como un médico, e destino.

Pero aquí está o sitio xeralmente sempre cargado na munición completa, nada cambia despois a carga, tendo en conta o tempo que alguén veu ... pero, mesmo no caso de que se trata dunha clínica vida real, a primeira vez que visite un novo cliente para dar páxina de información suficiente , contactos e ... o rexistro ventá pódese sempre que a visita ao lugar se fixo durante as horas, como prescrito polo médico non está dispoñible, un compromiso temporal faise nunha oficina diferente ...

Punto no espazo Internet

A resposta clásica do recurso do espazo de Internet - en resposta a unha petición de emisión dunha páxina web (xeralmente na casa), e despois o outro, a petición do visitante. Sitio Server tamén contén imaxes, estilos, guións de código JavaScript, PHP, etc Non todos os PHP-arquivos facer páxinas, algúns deles poden responder a solicitudes de AJAX:. Para recibir, procesar e enviar información.

Escribir un guión nun palpebrar de ollos. Pero chegar ao punto de control no espazo Internet, é imposible determinar quen e por que abordar, que é activado é o nome, o enderezo IP e enlace. Calquera movemento na rede ocorre en software, sobre todo a través dun navegador, pero tamén a través dos robots de orixe e destino diferente a través doutros lugares de acción.

Script, gañar o control, só pode coñecer con precisión: unha visita a través do que o navegador do visitante veu, cunha referencia a partir do cal enderezos IP, e da presenza de cookies. Só esta última pode proporcionar información a formar a páxina principal, pero só se o visitante xa estivo aquí. En todos os demais casos, é posible xerar só a resposta xeral do servidor. AJAX-exemplos que son fáciles de atopar en Internet, debe ser usado con coidado. Erros no (uso) do obxecto XMLHttpRequest para seguir non é fácil.

A resposta global eo diálogo privado

A resposta global a partir do servidor - páxina común, chamada o principal do que se chama o índice, e comeza con un sitio web que está en desacordo cos seus enlaces a outras páxinas dispoñíbeis. Con todo, se o visitante coñece os nomes dos outros páxinas, están no seu entendemento non será menos importante que o designado creador. Aquí está o modelo clásico, dunha soa vez: a concepción global e funcionalidade que incide sobre todos os visitantes.

Diálogo privado - unha continuación da sesión anterior do visitante. A web xa sabe o que fixo, que estaba interesado no que foi visto páxina e poñelas na súa memoria, escribiu algo en cookies do navegador.

Empregou dous solicitude básica para o servidor para descargar o sitio e traballar con el: Get e POST. o resultado da consulta é unha páxina enteira. Na páxina resultante, o visitante pode activar estes ou outros eventos que están configurados na acción de certos elementos da páxina.

elementos da páxina Eventos

elemento de páxina pode ser a clave para atopar a información, significado - para sacar o contido dun campo de texto e descubrir que escribiu un visitante. O evento pode ocorrer en un elemento de menú, imaxe, cadro de texto. En calquera caso, JavaScript-función será executado, que pode realizar AJAX petición do seguinte xeito:

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

Así función InitXML () defínese como segue (variable var scXHR describirse fóra da función):

función InitXML (scURL) {

scXHR = nulo;

se (window.XMLHttpRequest)
{try
{ScXHR = new XMLHttpRequest ();
} Catch (e) {}
} else
se (window.ActiveXObject)
{try
{ScXHR = new ActiveXObject ( 'MSXML2.XMLHTTP');
} Catch (e)
{try
{ScXHR = new ActiveXObject ( 'Microsoft.XMLHTTP');
} Catch (e) {}
}
}
se (scXHR)
{
scXHR.open ( "get", scURL);
scXHR.onreadystatechange = WaitReplySC;
scXHR.send (nulo);
};
}

Esta función recibe un URL e inicia unha proposta. resposta asíncrono virá así que vai cumprir o guión especificado na URL (neste caso - scSrvPhpWord.php, situado na ../Mphp/ cartafol en relación á raíz do sitio), e comezará WaitReplySC function (), que vai para a entrada do XML de resposta do servidor, incluíndo o título e contido.

resposta do servidor

En realidade, o servidor é un script PHP - un programa que comeza coa instalación das condicións esenciais, baixar as facilidades necesarias, pretratamento, que depende dos fins para os desenvolvedores:

namespace PhpOffice \ PhpWord;

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

ignore_user_abort (True);
set_time_limit (12);

usar PhpOffice \ PhpWord \ MphpObj \ scDocuments;

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

Representou o inicio dunha marca que indica algún erro, prohibe deixar un script cando o usuario fai logoff e establece un límite de tempo para realizar caso loop - 12 segundos. Seguinte biblioteca de ligazóns PhpOffice \ PhpWord para documentos * .docx.

Como se mostra arriba AJAX-call ( '... cTask = GoPage' + '& cOwnerCode =' + cOwnerCode + '& cSessionCode =' + cSessionCode + '& cActiveItem =' + cActiveItem) - os catro Get-variables, que pode ou non ser, deben comprobar a súa dispoñibilidade real:

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

Despois de realizar o guión acción preparatoria DECIDE:

switch ($ cTask) {

caso 'GoPage': // (este é un reto durante a descarga de inicio ou actualizar a páxina)

$ COwnerCode = 'cOwner'
$ CSessionCode = 'CSession'
$ CContents = 'cContents'
$ CStatus = 'cStatus'
$ Chtml = iconv ( 'UTF-8', 'CP1251', 'elemento de codificación ");
$ CActiveItem = iconv ( 'UTF-8', 'CP1251', 'variables');

$ CReply = "scSrvRM | GoPage | Set | {$ cOwnerCode}` {$ cSessionCode} | {$ cContents} `{$ cStatus} | {$ chtml} | {$ cActiveItem}";

break;

}

ea parte final do guión:

header ( "Content-Type: text / xml; aceptarse charset = utf-8");
cabeceira ( "cache-Control: non-cache");
echo '';
$ CReply = iconv ( 'CP1251', 'UTF-8', $ cReply); // conversión de 'CP1251' en 'UTF-8?
echo $ cReply;

Obtendo a resposta do cliente

Na páxina que se preme no navegador, verificouse que, logo que o servidor pode preparar unha resposta, el será procesado función WaitReplySC:

funcionar WaitReplySC () {

try {

se (scXHR.readyState == 4) {
if (scXHR.status == 200) {// procesamento de resposta

var TestReply = scXHR.responseText;

if (( 'Erro Parse' TestReply.indexOf ()> 0) ||
(TestReply.indexOf ( «o anuncio ')> 0)) alert (scXHR.responseText);

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

var CCMD = Data [1];
var CPO = Data [2];
var aOwnerSession = Data [3] .Split ( '' ');
cOwnerCode = aOwnerSession [0];
var cSessionCode = aOwnerSession [1];
var aContentStatus = Data [4] .Split ( '' ');
var cContent = aContentStatus [0];
var cStatus = aContentStatus [1];
var cHTML = Data [5]; // servidor HTML-resposta
var cVarValues = Data [6]; // variables para formularios

switch (CCMD) {

caso 'GoPage':

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

break;
}

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

}

Así, empregando os AJAX-exemplos, a páxina é cargada no navegador obter (no elemento scTestLine):

Responder = [cOwner, CSession, cContents, cStatus, elementos que codifica os valores das variables]

Na representación de código, jQuery e WordPress

Páxina no navegador e o texto do guión escrito en UTF-8, para a función uso iconv () para convertir caracteres rusos. O resto do esqueleto representada polo código é moi sinxelo e pode ser facilmente repetida para o propósito particular.

Suxeito a modificación só na resposta do servidor de procesamento de función WaitReplySC () eo código de script real que xera a resposta. Chama a función InitXML (para un scURL e datos relevantes para el) colócanse manipuladores de eventos sobre os elementos da páxina e establecer o significado destes elementos.

exemplos presentados de AJAX e orientada a "manual" o uso da tecnoloxía.

En varios sistemas de xestión de contidos (SMS) capacidades son descritos de distintas formas, como norma xeral, no estilo dunha especificidade particular. Por exemplo, as posibilidades de chamada jQuery AJAX realízanse jQuery.ajax () funcións en calquera nivel: jQuery.get () e jQuery.post (). O parámetro se transmite URL e configuración (conxunto de pares de valores clave +). jQuery.ajax () devolve XMLHttpRequest-obxecto.

JQuery para controlar os resultados da función métodos propostos-: XHR.done () - a conclusión exitosa da solicitude. XHR.fail () - manipulación de erro.

jqXHR.done () método yavlyatsya manipulador alternativa a conclusión exitosa de AJAX-solicitude. Substitúe método superada jqXHR.success ().

Do mesmo xeito, o uso de no WordPress AJAX-tecnoloxía. Aquí, todo implantouse no sistema de xestión de contidos, só precisa utilizar a estrutura proposta. Os documentos proporcionou unha descrición detallada.

AJAX aplicación depende esencialmente das ferramentas escollidas, a pesar de en versión manual poden ser utilizados en paralelo ou en adición ao sistema de xestión de contidos seleccionado, unha ou outra versión do jQuery. O último é útil para traballar por conta propia, porque case todos os SMS moderna usalo, pero cada un á súa maneira.

Un exemplo clásico de aplicación

uso sinxelo e exponencial de AJAX - Cart tenda en liña. almacenar páxinas son sempre cheo de bens, aínda que en realidade eles non poden ser. Recargar normalmente leva un tempo considerable, pero cando un visitante selecciona un produto, pode simplemente desistir del ou cambiar o elixido, que o sitio é sempre desexable para amosar rapidamente.

Normalmente realízase en forma de cestas e marcas arredor elementos seleccionados. Sen o uso de AJAX cambios dinámicas a eses elementos é problemática.

AJAX-scripts que aplican mecanismos para engadir / eliminar elementos ao seu carro, tornouse de feito en moitos SMS.

Para a transmisión normal de datos a través da forma AJAX pode ser formada dun xeito convencional (para introducir o nome e contrasinal):