The Ajax load () and post () method examples in jquery are detailed _jquery

This example describes the load () and post () method of Ajax in jquery. Share to everyone for your reference, specific as follows:

A, load () method

The jquery Ajax Load () method can load the remote HTML file code and insert it into the DOM, which is a little different from the post,get, but can quickly load a page of HTML to save it in the DOM and execute it.

The load () method uses the Get method by default, and the Post method is used if the data parameter is passed.

Automatically converts to POST when additional parameters are passed. In JQuery 1.2, you can specify a selector to filter the loaded HTML document, and only the filtered HTML code will be inserted into the DOM. Syntax like "url #some > selector", the default selector is "body>*".

Explain:

Load is the simplest Ajax function, but the use has limitations:

1. It is primarily used for AJAX interfaces that return HTML directly
2.load is a jquery wrapper set method that needs to be invoked on the jquery wrapper set, and the returned HTML is loaded into the object, even if the callback function is set. The load interface is designed to be smart and easy to use. The following example demonstrates the use of the load interface:

Load () function:

Function Description: Load (URL, [data], [callback]) return value: JQuery

Parameter description:

URL: To be loaded into the HTML Web site.
Data: (optional parameters) sent to the server's key/value.
Callback: (optional parameter) The callback function when it is successfully loaded.

Here's an example demo:

First, create the test.html file you want to load:

Then create the ajax.html file and remember to introduce jquery.

The above example shows how to use the Load method.

Tips:

① we need to keep an eye on the browser cache and add a timestamp parameter (NET Date ()) When using the Get method. GetTime () to ensure that each URL is sent differently, you can avoid browser caching.

② When a space is added after the URL parameter, such as "", an "unrecognized symbol" error occurs, and the request is sent normally. However, HTML cannot be loaded into the DOM. Resolution of the problem after deletion.

Second, post () method

Ajax in jquery has two data sending modes, one is get (), the previous article has said, the other is post (). Here again to introduce you, there is a need to know friends can refer to.

First know to Jquery.post (URL, [data], [callback], [type])

Describe the parameters:

URL: Sends the request address.
Data: Key/value parameter to be sent.
Callback: callback function when sending success.
Type: Returns the content format, XML, HTML, script, JSON, text, _default.

Description

Loads information through a remote HTTP POST request.

This is a simple POST request function to replace the complex $.ajax. Callback functions can be invoked when the request succeeds. If you need to perform a function when an error occurs, use $.ajax.

Let's take a look at a simple example

Usage 2: (click Post data to return data)

<input type= "button" id= "Bnajax" value= "Ajax" onclick= "Ajaxtest ()"/> <script type= "
text/javascript" >
 function ajaxtest ()
 {
 $.post ("http://localhost:8012/t.asp", {"TXT": "123"},function (data)
 {
  $ ("#divMsg"). HTML (data);
 }
</script>

Example 3

JS Code:

<script>
$ (document). Ready (function () {
  $ (". Ajax_btn"). Click (function () {
   $.post ("ajax.php") ,//asynchronously processes dynamic page
   {name:$ (". Name"). Val ()},//Gets the value of the class name "name", with the name asynchronous pass value
   function (data) {//data as the inverse value. function to handle the inverse value of
     $ (". Content"). val (data), after the return value, fill it in the text box with the class name "content"
   );
  }
) </script>

ajax.php Code:

<?php
$name =$_post["name"];
if ($name = = "Netxu") {
  echo "Sorry,". $name. " Data exists ";
}
else{
  echo "Congratulations,". $name. " can use ";
}
? >

I hope this article will help you with the jquery program design.