Heim > Web-Frontend > js-Tutorial > Umfassende Analyse umfassender Ajax-Anwendungen

Umfassende Analyse umfassender Ajax-Anwendungen

亚连
Freigeben: 2018-05-23 17:16:47
Original
1589 Leute haben es durchsucht

AJAX = Asynchrones JavaScript und XML, AJAX ist eine Technologie zum Erstellen schneller, dynamischer Webseiten. Dieser Artikel bietet Ihnen eine umfassende Analyse der umfassenden Anwendung von Ajax. Er ist sehr gut und hat Referenzwert. Interessierte Freunde sollten ihn sich gemeinsam ansehen.

AJAX ist „Asynchronous Javascript And XML“ (asynchron). JavaScript und XML) Bezieht sich auf eine Webentwicklungstechnologie zum Erstellen interaktiver Webanwendungen.

AJAX = Asynchrones JavaScript und XML (eine Teilmenge der Standard Universal Markup Language).

AJAX ist eine Technologie zur Erstellung schneller, dynamischer Webseiten.

AJAX ermöglicht die asynchrone Aktualisierung von Webseiten durch den Austausch einer kleinen Datenmenge mit dem Server im Hintergrund. Das bedeutet, dass Teile einer Webseite aktualisiert werden können, ohne dass die gesamte Seite neu geladen werden muss.

Herkömmliche Webseiten (die kein AJAX verwenden) müssen die gesamte Webseite neu laden, wenn der Inhalt aktualisiert werden muss.

•"xml": Gibt ein XML-Dokument zurück, das mit jQuery verarbeitet werden kann.

•"html": Gibt reine Text-HTML-Informationen zurück; das enthaltene Skript-Tag wird ausgeführt, wenn es in den Dom eingefügt wird.

•"script": Gibt Nur-Text-JavaScript-Code zurück. Ergebnisse werden nicht automatisch zwischengespeichert. Es sei denn, der Parameter „Cache“ ist gesetzt. Hinweis: Bei Remote-Anfragen (nicht unter derselben Domäne) werden alle POST-Anfragen in GET-Anfragen umgewandelt. (Da zum Laden das DOM-Skript-Tag verwendet wird)

•"json": Gibt JSON-Daten zurück.

•"jsonp": JSONP-Format. Beim Aufrufen einer Funktion im JSONP-Formular, z. B. „myurl?callback=?“, ersetzt jQuery automatisch ? durch den richtigen Funktionsnamen, um die Callback-Funktion auszuführen.

•"text": Gibt eine einfache Textzeichenfolge zurück

1. Übergeben Sie Zeichenfolgenvariablen an das Frontend und geben Sie Zeichenfolgenvariablen an das Backend zurück (nicht JSON). Format)

Um die verstümmelten chinesischen Zeichen zu lösen, die bei der Ajax-Datenübertragung auftreten, wird hier vor der Übertragung der Zeichenfolge die Javascript-Funktion escape() zum Codieren verwendet die chinesische Zeichenkette und geben

wird mit der Funktion unescape() dekodiert, sodass chinesische Zeichen normal angezeigt werden können. Natürlich fügt der PHP-Hintergrundcode auch Header-Dateien hinzu, um sicherzustellen, dass chinesische Zeichenketten nicht verstümmelt werden. Verschiedene Backend-Codes lösen das Problem von

verstümmelten chinesischen Schriftzeichen wie folgt:

PHP:

header('Content-Type:text/html;charset=GB2312');
Nach dem Login kopieren

 

Javascript-Code:

$(function(){
var my_data="前台变量";
my_data=escape(my_data)+"";//编码,防止汉字乱码
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data},
//dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data,status){//如果调用php成功
alert(unescape(data));//解码,显示汉字
}
});
});
Nach dem Login kopieren

PHP-Code:

header('Content-Type:text/html; charset=gb2312');//使用gb2312编码,使中文不会变成乱码
$backValue=$_POST['trans_data'];
echo $backValue."+后台返回";
Nach dem Login kopieren

2. Mehrere Fronten -end übergibt ein eindimensionales Array, der Hintergrund gibt eine Zeichenfolgenvariable zurück (Nicht-JSON-Format)

Im Nicht-JSON-Format kann der Hintergrund nur Zeichenfolgen zurückgeben, wenn Sie möchten Geben Sie im Hintergrund ein Array zurück. Sie können das JSON-Format verwenden, das später in diesem Artikel ausführlich vorgestellt wird.

Javascript-Code:

$(function(){
var my_data=new Array();
var my_data1=new Array();
my_data[0]=0;
my_data[1]=1;
my_data[2]=2;
my_data1[0]=10;
my_data1[1]=11;
my_data1[2]=12;
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data,trans_data1:my_data1},
//dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data,status){//如果调用php成功
alert(data);
}
});
});
Nach dem Login kopieren

PHP-Code:

//读取第一个数组
$backValue="trans_data:";
$trans=$_POST['trans_data'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
//读取第二个数组
$backValue=$backValue." , trans_data1:";
$trans=$_POST['trans_data1'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
echo $backValue;
Nach dem Login kopieren

3. Das Frontend übergibt mehrere eindimensionale Arrays und das Backend gibt ein zweidimensionales Array zurück (JSON-Format)

Javascript-Code:

$(function(){
var my_data=new Array();
var my_data1=new Array();
my_data[0]=0;
my_data[1]=1;
my_data[2]=2;
my_data1[0]=10;
my_data1[1]=11;
my_data1[2]=12;
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data,trans_data1:my_data1},
dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data){//如果调用php成功
}
alert(back);
}
});
});
Nach dem Login kopieren

PHP-Code:

header('Content-Type:text/html; charset=gb2312');//使用gb2312编码,使中文不会变成乱码
$backValue=array();
$backValue[0]=$_POST['trans_data'];
$backValue[1]=$_POST['trans_data1'];
echo json_encode($backValue);
Nach dem Login kopieren

4. Das Frontend übergibt ein eindimensionales Array und ein zweidimensionales Array, und das Backend gibt ein zweidimensionales Array zurück (JSON-Format)

Javascript-Code:

$(function(){
var my_data=new Array();
var my_data1=new Array();
var my_data2=new Array();
my_data[0]=0;
my_data[1]=1;
my_data[2]=2;
my_data1[0]=10;
my_data1[1]=11;
my_data1[2]=12;
my_data2[0]=my_data;
my_data2[1]=my_data1;
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data,trans_data1:my_data1,trans_data2:my_data2},
dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data){//如果调用php成功
}
alert(back);
}
});
});
Nach dem Login kopieren

PHP-Code:

header('Content-Type:text/html; charset=gb2312');//使用gb2312编码,使中文不会变成乱码
$backValue=array();
$backValue=$_POST['trans_data2'];
$backValue[2]=$_POST['trans_data'];
$backValue[3]=$_POST['trans_data1'];
echo json_encode($backValue);
Nach dem Login kopieren

Das Obige habe ich für alle zusammengestellt. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

So verwenden Sie den Nginx-Reverse-Proxy, um domänenübergreifende Ajax-Anfragen zu vermeiden

Eingehende Analyse von Nginx bei der Implementierung von domänenübergreifenden AJAX-Anforderungsproblemen

Umfassende Analyse der $.Ajax()-Methodenparameter (grafisches Tutorial)

Das obige ist der detaillierte Inhalt vonUmfassende Analyse umfassender Ajax-Anwendungen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage