Comprehensive analysis of Ajax comprehensive applications

AJAX = Asynchronous JavaScript and XML, AJAX is a technology for creating fast, dynamic web pages. This article brings you a comprehensive analysis of the comprehensive application of Ajax. It is very good and has reference value. Friends who are interested should take a look at it.

AJAX stands for "Asynchronous Javascript And XML" (asynchronous JavaScript and XML). Refers to a web development technology for creating interactive web applications.

AJAX = Asynchronous JavaScript and XML (a subset of Standard Universal Markup Language).

AJAX is a technology for creating fast, dynamic web pages.

By exchanging a small amount of data with the server in the background, AJAX can enable asynchronous updates of web pages. This means that parts of a web page can be updated without reloading the entire page.

Traditional web pages (not using AJAX) must reload the entire web page if the content needs to be updated.

•"xml": Returns an XML document that can be processed with jQuery.

•"html": Returns plain text HTML information; the included script tag will be executed when inserted into the dom.

•"script": Returns plain text JavaScript code. Results are not automatically cached. Unless the "cache" parameter is set. Note: When making remote requests (not under the same domain), all POST requests will be converted into GET requests. (Because the DOM script tag will be used to load)

•"json": Returns JSON data.

•"jsonp": JSONP format. When calling a function using JSONP form, such as "myurl?callback=?" jQuery will automatically replace ? with the correct function name to execute the callback function.

•"text": Returns a plain text string

1. Pass string variables to the frontend and return string variables to the backend (non-json format)

Here, in order to solve the garbled Chinese characters that appear in Ajax data transfer, before the string is transferred, the javascript function escape() is used to encode the Chinese character string and return # The string of

header('Content-Type:text/html;charset=GB2312');

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));//解码，显示汉字
}
});
});

PHP code:

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

## 2. Multiple front-end transfers A one-dimensional array, the background returns a string variable (non-json format)

In non-json format, the background can only return strings. If you want to return an array in the background, you can use json format , which will be introduced in detail later in this article.

$(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);
}
});
});

##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;

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);
}
});
});

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);

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);
}
});
});

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);

How to use Nginx reverse proxy to avoid ajax cross-domain requests

In-depth analysis of Nginx Implementing AJAX cross-domain request issues

##Comprehensive analysis of $.Ajax() method parameters (graphic tutorial)

The above is the detailed content of Comprehensive analysis of Ajax comprehensive applications. For more information, please follow other related articles on the PHP Chinese website!