Ajax usage and caching in jquery $getjson and $get will be cached by IE.

Source: Internet
Author: User

Original address: http://www.cnblogs.com/fullhouse/archive/2012/01/17/2324842.html

1:get access to the browser is considered to be idempotent
Just a single result of the same URL [same as the entire URL string exactly matches]
So when the second visit if the URL string does not change the browser is directly out of the results of the first visit

Post is considered to be a variable access (the browser thinks that post commits must be changed)

Prevent idempotent access to get add after URL? +new Date ();, [in short, the URL string for each access is different]

You should also follow this principle when designing Web pages.

2: one. Talk about the difference between the get and post of Ajax

Get mode:
Simple data can be transferred in a Get mode, but the size is generally limited to 1KB, and the data is appended to the URL (HTTP header delivery), that is, the browser appends the individual form field elements and their data to the resource path in the request line as a URL parameter. The most important point is that it will be cached by the client's browser, so that others can read the customer's data from the browser's history, such as the account number and password. Therefore, in some cases, the Get method poses a serious security problem.

Post mode:
When a post is used, the browser sends each form field element and its data to the Web server as the entity content of the HTTP message, rather than as a parameter to the URL address, and the amount of data that is passed by post is much larger than the amount of data that is sent using the Get method.

In short, the Get method transmits small amounts of data, high processing efficiency, low security, will be cached, and post instead.

Use the Get method to be aware of:
1 for a GET request (or any that involves a URL pass parameter), the passed arguments are processed first by the encodeURIComponent method. Example: var url = "Update.php?username=" +encodeuricomponent ( username) + "&content=" +encodeuricomponent

(content) + "&id=1";


Use the Post method to be aware of:
1. Set the header's Context-type to Application/x-www-form-urlencode to ensure that the server knows that there are parameter variables in the entity. The setRequestHeader ("Context-type", "application/x-www-form-urlencoded;") of the XMLHttpRequest object is usually used. Cases:

Xmlhttp.setrequestheader ("Content-type", "application/x-www-form-urlencoded");
2. The parameter is the key value pair corresponding to the name/value one by one, separated by the & number for each pair. As Var name=abc&sex=man&age=18, pay attention to Var name=update.php?

Abc&sex=man&age=18 and the name=?abc&sex=man&age=18 of Var are all wrong;
3. The parameters are sent in the Send (parameter) method, for example: Xmlhttp.send (name); If it is get mode, direct xmlhttp.send (NULL);

4. The server-side request parameter distinguishes between get and post. If it is GET mode then $username = $_get["username"]; If it is POST mode, then $username = $_post["username"];

Ajax garbled problem

Causes of garbled:
1, xtmlhttp the data returned by default character encoding is Utf-8, if the client page is gb2312 or other encoded data will produce garbled
2, Post method submission data The default character encoding is Utf-8, if the server side is gb2312 or other encoded data will produce garbled
The solutions are:
1, if the client is GB2312 encoding, the server specifies the output stream encoding
2, the server side and the client are using UTF-8 encoding

Gb2312:header (' content-type:text/html;charset=gb2312 ');

Utf8:header (' Content-type:text/html;charset=utf-8 ');

Note: If you have done the above method, or return garbled words, check whether your way is get, for the GET request (or all involved in the URL to pass parameters), the passed parameters must be preceded by the encodeURIComponent method processing. If not treated with encodeuricomponent, it will also produce garbled characters.

$.ajax does not cache version:
$.ajax ({
Type: "GET"
URL: ' test.html ',
Cache:false,
DataType: "HTML",
Success:function (msg) {
Alert (msg);
}
});

Jquery.ajax (options): Loading remote data over HTTP requests
This is the underlying AJAX implementation of jquery. Easy to use high-level implementation see $.get, $.post and so on.
$.ajax () returns the XMLHttpRequest object that it created. In most cases you do not need to manipulate the object directly, but in special cases you can use it to terminate the request manually.
Note: If you specify the DataType option, make sure that the server returns the correct MIME information (such as XML returns "Text/xml"). The wrong MIME type can cause unpredictable errors. See Specifying the Data Type for AJAX requests.
When you set the datatype type to ' script ', all the remote (not in the same domain) post requests are converted back to get mode.
$.ajax () has only one parameter: The parameter Key/value object, which contains the configuration and callback function information. Detailed parameter options are shown below.
In JQuery 1.2, you can load JSON data across domains and set the data type to JSONP when used. When calling a function using JSONP form, such as "myurl?callback=?" JQuery is automatically replaced? is the correct function name to execute the callback function. When the data type is set to "Jsonp", JQuery automatically calls the callback function. (I don't quite understand that)
Parameter list:
Name Type description
URL String (Default: Current page address) to send the requested address.
Type String (default: "Get") Request mode ("POST" or "get"), the default is "get". Note: Other HTTP request methods, such as PUT and DELETE, can also be used, but only some browsers support it.
Timeout number sets the request time-out (in milliseconds). This setting overrides the global settings.
Async Boolean (Default: TRUE) The default setting, all requests are asynchronous requests. If you need to send a synchronization request, set this option to false. Note that the sync request will lock the browser, and the user's other actions must wait for the request to complete before it can be executed.
Beforesend functions that can modify XMLHttpRequest objects before sending a request, such as adding a custom HTTP header. The XMLHttpRequest object is the only parameter.

function (XMLHttpRequest) {
This The options for this AJAX request
}
The cache Boolean (default: TRUE) JQuery 1.2 new feature, set to False will not load the request information from the browser cache.
The callback function after complete function request is completed (called when the request succeeds or fails). Parameters: XMLHttpRequest Object, Success information string.

function (XMLHttpRequest, textstatus) {
This The options for this AJAX request
}
ContentType String (default: "application/x-www-form-urlencoded") the content encoding type when sending information to the server. The default values are suitable for most applications.
Data Object,
String to send data to the server. is automatically converted to the request string format. The GET request will be appended to the URL. View the ProcessData option description to disallow this automatic conversion. Must be a key/value format. If an array, JQuery automatically corresponds to the same name for the different values. such as {foo:["bar1", "Bar2"]} converted to ' &foo=bar1&foo=bar2 '.
DataType String expects the data type returned by the server. If not specified, JQuery automatically returns Responsexml or ResponseText based on the HTTP packet MIME information and is passed as a callback function parameter, with the available values:

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

HTML: Returns plain text HTML information, including the script element.

"Script": Returns plain text JavaScript code. Results are not automatically cached.

"JSON": Returns the JSON data.

"JSONP": Jsonp format. When calling a function using JSONP form, such as "myurl?callback=?" JQuery is automatically replaced? is the correct function name to execute the callback function.

This method is called when the error Function (default: Automatic judgment (XML or HTML)) requests fail. This method has three parameters: the XMLHttpRequest object, the error message, and (possibly) the error object being captured.

function (XMLHttpRequest, textstatus, Errorthrown) {
Typically, Textstatus and Errorthown have only one of the values
This The options for this AJAX request
}
Global Boolean (default: TRUE) to trigger an overall AJAX event. Setting to FALSE will not trigger global AJAX events, such as Ajaxstart or Ajaxstop. Can be used to control different AJAX events
Ifmodified Boolean (default: false) only gets new data when the server data changes. Use the HTTP packet last-modified header information to determine.
ProcessData Boolean (default: TRUE) by default, the sent data is converted to an object (technically not a string) to match the default content type "application/x-www-form-urlencoded". Set to False if you want to send DOM tree information or other information that you do not want to convert.
The callback function after the success function request succeeds. This method has two parameters: the server returns data, returns the status

function (data, textstatus) {
Data could be xmldoc, jsonobj, HTML, text, etc ...
This The options for this AJAX request
}
Here are a few Ajax event parameters: Beforesend, Success, complete, error. We can define these events to handle each of our AJAX requests well. Note that the this in these AJAX events is the option information that points to the Ajax request (refer to the picture of this for the Get () method).
Please read the above parameter list carefully, if you want to use jquery for Ajax development, then these parameters you must be familiar with.
Sample code to get the blog home page of the article title:
$.ajax ({
Type: "Get",
URL: "Http://www.cnblogs.com/rss",
Beforesend:function (XMLHttpRequest) {
Showloading ();
},
Success:function (data, textstatus) {
$ (". Ajax.ajaxresult"). HTML ("");
$ ("item", data). Each (function (i, Domele) {
$ (". Ajax.ajaxresult"). Append ("<li>" +$ (Domele). Children ("title"). Text () + "</li>");
});
},
Complete:function (XMLHttpRequest, Textstatus) {
Hideloading ();
},
Error:function () {
Request Error Handling
}
});

Jquery.ajaxsetup: Set global AJAX default options.
Set the default address of the AJAX request to "/xmlhttp/", prohibit triggering of global Ajax events, use POST instead of the default GET method. Subsequent AJAX requests no longer set any option parameters.
JQuery Code:
$.ajaxsetup ({
URL: "/xmlhttp/",
Global:false,
Type: "POST"
});
$.ajax ({data:mydata});
Serialize () and Serializearray ()
Serialize (): The table contents of the sequence table are strings.
Serializearray (): Serializes a tabular element (similar to the '. Serialize () ' method) to return the JSON data structure.
Example:
HTML code:
<p id= "Results" ><b>results: </b> </p>
<form>
<select name= "single" >
<option>Single</option>
<option>Single2</option>
</select>
<select name= "multiple" multiple= "multiple" >
<option selected= "Selected" >Multiple</option>
<option>Multiple2</option>
<option selected= "Selected" >Multiple3</option>
</select><br/>
<input type= "checkbox" name= "Check" value= "Check1"/> Check1
<input type= "checkbox" name= "Check" value= "Check2"
checked= "Checked"/> Check2
<input type= "Radio" name= "Radio" value= "Radio1"
checked= "Checked"/> Radio1
<input type= "Radio" name= "Radio" value= "Radio2"/> Radio2
</form>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.