Jquery getJSON () parses JSON data (cross-origin)

In the past, we used JavaScript to parse JSON data. Now I want to introduce jquery to my friends to quickly parse JSON data. If you have any need to know about JSON data, please do not refer to it.

GetJSON (): This is the jquery function to operate json data.
JQuery. getJSON (url, [data,] [success (data, textStatus, jqXHR)])

UrlA string containing the URL to which the request is sent.

DataA map or string that is sent to the server with the request.

Success (data, textStatus, jqXHR) A callback function that is executed if the request succeeds.

The callback function accepts three parameters, the data returned by the first book, the second is the state, and the third is the XMLHttpRequest of jQuery. We only use the first parameter.

$. Each () is used to parse JSON data in the callback function. The following is an official document:

JQuery. each (collection, callback (indexInArray, valueOfElement ))

CollectionThe object or array to iterate over.

Callback (indexInArray, valueOfElement) The function that will be executed on every object

Use AJAX requests to obtain JSON data and output the results:

The Code is as follows:	Copy code
$ ("Button"). click (function (){ $. GetJSON ("demo_ajax_json.js", function (result ){ $. Each (result, function (I, field ){ $ ("Div"). append (field + ""); }); }); });

Example

Load JSON data from test. js and display a name field in JSON data:

The Code is as follows:	Copy code
$. GetJSON ("test. js", function (json ){ Alert ("JSON Data:" + json. users [3]. name ); });

$. GetJSON () Cross-origin request

1. The same domain name and other requests can be the same
Js:

The Code is as follows:	Copy code
Var url = "http: // localhost: 2589/a. ashx "; $ (Function (){ $. GetJSON (url, function (data ){ Alert (data. Name ); }) });

The server returns a string:
{"Name": "loogn", "Age": 23}
2. Under Different domain names
Js:

The Code is as follows:	Copy code
Var url = "http: // localhost: 2589/a. ashx? Callback =? "; $ (Function (){ $. GetJSON (url, function (data ){ Alert (data. Name ); }) });

The server returns a string:
Jquery1706543070116920333_1324445763158 ({"Name": "loogn", "Age": 23 })
The returned string is a function called "jQuery1706543070425920333_1324445763158". The parameter is {"Name": "loogn", "Age": 23 }.
In fact, this long function name is callback = in the Request Path? I think it should be like this: $. getJSON method generates a reference name for the callback method, replace ?. The above request will become
Http: // localhost: 2589/a. ashx? Callback = jQuery1706543070425920333_1324445763158 & _ = 1324445763194. You need to handle this when the server returns the json file, for example:

The Code is as follows:	Copy code
String cb = context. Request ["callback"]; Context. Response. Write (cb + "(" + json + ")");

The parameter name callback can also be changed to jsoncallback. I think we are afraid of conflict. jsoncallback should be checked first and no callback detection will be performed (not tested !!)
? But also the specific function name, so that the callback function cannot be anonymous, use? Generation is just a convenience provided by jQuery for our general operations.

Chinese character parameter garbled.

In this case, first check the encoding of the Web server. For example, if you use tomcat, you can view
The <ctor/> label in the conf/server. xml file does not set URIEncoding. If so, the conversion is based on this encoding, if not, the default is "ISO-8059 ".

If URIEncoding = "GBK", the background code is as follows:

Java code

The Code is as follows:	Copy code
1. String test = request. getParameter ("test"); // a Chinese character sent back from the front end 2. test = new String (test. getBytes ("gbk"), "UTF-8"); // convert to UTF-8 format String test = request. getParameter ("test"); // a Chinese character sent back from the front end Test = new String (test. getBytes ("gbk"), "UTF-8"); // convert to UTF-8 format

Note: 'gbk' and 'utf-8' must be in lower case.

Java code

Solution 1:

The Code is as follows:	Copy code
Front-end Var data = {name: encodeURI ($ ("# myName"). val (), "UTF-8"), pwd: "password "}; Modify the background String name = URLDecoder. decode (request. getParameter ("name"), "UTF-8 ");

Solution 2:

The Code is as follows:	Copy code
Front-end Var data = {name: encodeURI ($ ("# myName"). val (), "UTF-8"), pwd: "password "}; Modify the background String name = URLDecoder. decode (request. getParameter ("name"), "UTF-8 ");