Funzioni AJAX consentono pagine Web aggiornare il contenuto HTML senza che l'utente di dover ricaricare la pagina o passare a una pagina diversa. Il markup HTML per una pagina può chiamare una funzione JavaScript, che a sua volta può chiamare uno script PHP. Lo script PHP può recuperare dati aggiuntivi, a volte da un database e formattato nel markup XML, questo ritorno alla funzione JavaScript. Il codice JavaScript può quindi scrivere nuovi dati in HTML, facendo nuove informazioni appaiono come l'utente interagisce con la pagina Web.

Istruzioni

1

Creare un nuovo documento HTML. Digitare il seguente codice in un file vuoto nel vostro editor di testo e assegnare al file un'estensione ". html", quando è stato salvato:

< html >
< head >
< script type = "text/javascript" >
Function processData() () {
Scarica nuovi dati
}
< / script >
< / head >
< corpo >
< div id = "Aggiorna" > alcuni contenuti < / div >
< input type = "pulsante" valore = "premere me" onclick="processData()" / >
< / body >
< / html >

Quando l'utente fa clic sul pulsante visualizzato su questa pagina, il browser chiama la funzione JavaScript nella sezione head della pagina.

2

Creare un oggetto XMLHttpRequest. Aggiungere il seguente codice all'interno della funzione JavaScript:

var xmlHTTP;
Se (finestra. XMLHttpRequest) {xmlHTTP = new XMLHttpRequest ();}
else {xmlHTTP = new ActiveXObject;}

Questo modo la pagina Web gestire diversi browser.

3

Invia la tua richiesta per i dati a uno script PHP. Aggiungere il seguente codice all'interno della funzione JavaScript, lasciando spazio per il codice prima di esso:

xmlHTTP.open ("GET", "get_data.php", true);
xmlHTTP.send();

Questo indica al browser di richiedere ulteriori informazioni dallo script PHP specificato.

4

Crea il tuo script PHP. Aprire un nuovo file in un editor di testo e salvarlo come "get_data.php" per abbinare il parametro per il metodo di invio utilizzato nel codice JavaScript. Digitare il seguente codice di esempio:

<? php
echo "Nuovi dati";
? >

Si tratta di un semplice esempio per dimostrazione, ma è possibile aggiungere qualsiasi elaborazione di PHP che necessario, compreso le query di database. Se questo si adatta il tuo sito, è inoltre possibile creare il testo di risposta nel markup XML.

5

Gestire la risposta dallo script PHP. Nella funzione JavaScript, prima della riga in cui si apre l'oggetto XMLHttpRequest, aggiungere il codice riportato di seguito:

xmlHTTP.onreadystatechange=function() () {
Se (xmlHTTP.readyState==4 & & xmlHTTP.status==200) {
gestire i dati di risposta
}}

Quando JavaScript riceve una risposta dallo script PHP, questo codice verrà eseguito. Il codice verifica che la risposta è valida. All'interno di questa istruzione condizionale, è possibile aggiungere codice per scrivere i nuovi dati nella tua pagina HTML.

6

Aggiornare il contenuto della tua pagina. Nell'istruzione JavaScript risposta condizionale, aggiungere il seguente codice:

document.getElementById("update").innerHTML = responseText;

Questo codice identifica l'elemento div nella pagina e quindi scrive il testo di risposta dal codice PHP in esso.

7

Salvare i file e caricarli sul server. Passare alla pagina e fare clic sul pulsante per verificare che la funzione funziona. Si dovrebbe vedere il contenuto della modifica elemento div.

Consigli & Avvertenze

• Si possono passare i dati dalla funzione JavaScript allo script PHP, nonché ricevere dati.
• Script AJAX a volte problemi con la cache del browser. Per risolvere questo problema, è possibile aggiungere una variabile numerica casuale al codice JavaScript alla fine della stringa dell'URL di script PHP.