Introduction to Ajax
Ajax is considered to be (Asynchronous (asynchronous) JavaScript And Xml). Now, the technology that allows the browser to communicate with the server without having to refresh the current page is called Ajax.
Synchronization refers to the communication method in which the sender sends data and waits for the receiver to send a response before sending the next data packet.
Asynchronous refers to the communication method of the sender sending data without waiting for the receiver to send a response, and then sending the next data packet.
AJAX's flaws
AJAX uses a lot of JavaScript and AJAX engines, and this depends on browser support. Only supported by IE5.0 and above, Mozilla 1.0, NetScape7 and above. Although Mozilla also supports AJAX, the way to provide XMLHttpRequest is different. Therefore, programs using AJAX must test compatibility for individual browsers.
When AJAX updates the page content, the entire page does not refresh, so the back function of the web page is invalid; some users often don’t know whether the current data is old or has been updated. This requires users to be reminded in a clear location that "data has been updated".
Support for streaming is not as good as FLASH.
Some handheld devices (such as mobile phones, PDAs, etc.) are not able to support Ajax well now.
Serialization of form data:
$('#submit').click(function(){
$('#form').serialize(); //The data will be serialized into a string based on the name in the input; eg: name=yang $('#form').serializeArray(); //The data will be serialized into an array according to the name in the input; eg: [object]//Note: Without name, no value will be obtained //The following two methods are not jQuery () //Convert json string into json object () //Convert json object into json string});
jQuery's ajax method:
$.ajax({
url:'/comm/',
type:'POST', //GET
async:true, //or false, is it asynchronous data:{
name:'yang',age:25
},
timeout:5000, //Timeout time dataType:'json', //Returned data format: json/xml/html/script/jsonp/text beforeSend:function(xhr){
(xhr)
('Before sending')
},
success:function(data,textStatus,jqXHR){
(data)
(textStatus)
(jqXHR)
},
error:function(xhr,textStatus){
('mistake')
(xhr)
(textStatus)
},
complete:function(){
('Finish')
}
})
Native ajax method:
$('#send').click(function(){
//The 5 stages of the request, the value of readyState is corresponding to the value of readyState //0: Not initialized, send method is not called; //1: The request is being sent, and the send method has been called; //2: The request is sent and the send method is executed; //3: Response content is being parsed; //4: The response content has been parsed; var data = 'name=yang';
var xhr = new XMLHttpRequest(); //Create an ajax object = function(event){ // Listen to ajax object if( == 4){ //4 means that the analysis is completed if( == 200){ //200 is normal return (xhr)
}
}
};
('POST','url',true); //Create a connection, parameters one: sending method, two: request address, three: whether asynchronous, true is asynchronous ('Content-type','application/x-www-form-urlencoded'); //Organized (data); //send});