The basic usage of Ajax in jquery

JSON object and JSON string
JSON: Lightweight Data Interchange Format
1, JSON object: JSON object is a set of key-value pairs, between the key and the value by: delimited, many pairs of key value pairs, separated
Note: The JSON object requires that the key must use the "" wrapped string. "Invalid!!!"
2. JSON string: Wraps the JSON object in the form of a string.

3. The JSON object and the JSON string are converted to each other:

① Object---string json.stringify (obj)
② string-To-object Json.parse (Jsobj)

jquery also provides methods for string-to-object: $.parsejson (jsobj);

4. JSON array: Storing multiple JSON objects as arrays
JSON arrays can be nested with JSON objects, meaning that the value of a JSON object can be a JSON array.

. Load (): Selects a DOM node of the current page and loads an HTML snippet in the current DOM node:
Accept Parameters:
① can be an address to an HTML file that will load the entire HTML file into the current region:
$ ("Div1"). Load ("test.html");
② can be an HTML file + various selectors, which means that the specified area of the page is selected for loading
$ ("#div1"). Load ("test.html", H1, "UL", function () {alert ("Done")});

①type: The method that represents the AJAX request, can get and post
②url: Represents the requested background URL address
$.ajax ({
Type: "Get",
URL: "Java1801.json",
data:{
"name": "Zhang San"
},
Async:true,
}

③success: The callback function that represents the successful request. The callback function will accept three parameters, where the first parameter is the data that the request was successfully returned. 　　　　
Success:function (data,textstatus,jqxhr) {
var obj=json.parse (data);
Console.log (obj);
Console.log (data);
Console.log (textstatus);
Console.log (JQXHR);
Console.log (Jqxhr.responsetext);
Console.log (Jqxhr.responsexml);
},
When working with data, be aware that the object returned is a JSON string or a JSON object.
④error: Represents the callback function that is executed when the request fails.　　　　
Error:function (xmlhttprequest,textstatus,errorthrow) {
Console.log (XMLHttpRequest);
Console.log (Textstatus);
Console.log (Errorthrow);　　　　
}
⑤complete: The function
Complete:function (xhr,ts) {
Console.log (xhr.status) is executed regardless of successful failure, after the request is complete;
Console.log (TS);
}
⑥statuscode: Receives an object where the key is a variety of status states, and the value of the object represents the callback function corresponding to each status code.
[Common status code]
200-request succeeded
404-page Not found
500-Server error
403-access denied

statuscode:{
200:function () {
Console.log ("request succeeded");
},
404:function () {
Console.log ("Page not Found");
}
}
⑦async: Set to True to indicate an asynchronous request (default), set to False to indicate a synchronous request

⑧data: When requested, the data passed to the background is an object type that represents Name:value in the form of a key-value pair.

⑨datatype: Expected data type returned by the server. Common JSON, text, HTML

⑩timeout: Sets the request time-out period.

Three, JS homologous strategy
In JS when requesting other files, the requested file and the current file must be in the same protocol name, the same hostname, and the same port number.
Otherwise, the request will not succeed!! Cross-domain request settings are required if you want to request a non-homologous file

$ (function () {
$.get ("Java1801.json", {name: "Zhangsan"},function (data) {
Console.log (data);
}, "JSON");

Iv. Ajax The method used to detect the state of all Ajax on the page and execute the callback function

Ajaxcomplete (callback)
Ajaxerror (callback)
Ajaxsend (callback)
Ajaxstart (callback)
Ajaxstop (callback)
Ajaxsuccess (callback)

V. Form serialized to a string
$ ("Form input[type= ' button ']:eq (0)"). On ("click", Function () {
var str=$ ("Form:eq (0)"). Serialize ();
Console.log (str);
var username=$ ("Form input[name= ' UserName ']:eq (0)"). Val ();
var pwd=$ ("form input[name= ' pwd ']:eq (0)"). Val ();
var obj={
"UserName": UserName,
"PWD":p WD
};
Console.log (json.stringify (obj));
});

Vi. forms serialized as arrays
$ ("Form input[type= ' button ']:eq (1)"). On ("click", Function () {
var arr=$ ("Form:eq (0)"). Serializearray ();
var obj={};
Arr.foreach (function (item,index) {
Obj[item.name]=item.value;
});
Console.log (json.stringify (obj));
});

Vii. use of validate plug-ins
Plugin Download: http://www.runoob.com/jquery/jquery-plugin-validate.html
Instance Code

　　
The basic usage of Ajax in jquery