JQuery Ajax page Local Load method rollup _jquery

In jquery to implement the Ajax load method There are many kinds, unlike the previous JS Ajax only one, the following we introduce jquery AJAX implementation of local loading method summary, there is a need to understand friends can refer to.

Cases

$.ajax ({
URL: "hotelquery!queryhotelbycity.action",
type: "Post",
dataType: "HTML",
data: " Queryhotel.city= "+cityobj.value+" &queryhotel.wbcid= "+wbcid,
success:function (data) {
$ (" #hotellists "). HTML ($ (data). Filter (" #list "). html ());

Code resolution:

From the code above, we can see that the data returned is, but if we enclose a div with ID list in the part of the page where the AJAX request is made, we pass $ (data). Filter ("#list"). HTML () You can get the HTML content in the Div.

Instance

$ (document). Ready (function () {
function loadmessage ()
{
$ (this). html ("Loading ...");
var o = this;
var xmlhttp = $.ajax ({
URL: "service/indexlogin.aspx",
dataType: "html",
success:function (result)
{
$ (O). HTML (result);}}
);
Loadmessage.call ($ ("#addinfo"));
<form action= "#" method= "POST" >
<ul id= "Addinfo" >
loading ...
</ul>
</form>

The above is the method we use, in fact, there is a more simple way oh, the load () method to upload data from the server via AJAX request, and put the returned data into the specified element

$ (document). Ready (function () {
$ ("#addinfo"). Load ("Service/indexlogin.aspx", $ ("#addinfo li")) 

1. Load a php file, the PHP file does not contain the pass parameter $ ("#myID"). Load ("test.php");

Import test.php Run results in an element with ID #myid

2. Load a PHP file that contains a pass parameter

Copy Code code as follows:

$ ("#myID"). Load ("test.php", {"name": "Adam"});

The imported PHP file contains a pass-through parameter, similar to the following: Test.php?name=adam

3. Load a PHP file that contains multiple pass parameters. Note: The parameters are separated by commas

Copy Code code as follows:

$ ("#myID"). Load ("test.php", {"name": "Adam", "Site": "61dh.com"});

The imported PHP file contains a pass-through parameter, similar to the following: test.php?name=adam&site=61dh.com

4. Load a php file, the php file with an array as the passing parameters

Copy Code code as follows:

$ ("#myID"). Load ("test.php", {' myinfo[] ', ["Adam", "61dh.com"]});

The imported PHP file contains an array pass parameter.

Here's an introduction to the jquery Ajax page Local update

Ajax is an asynchronous process in which a portion of the code in a page sends out a network request, setting a callback function inside it, and executing a callback function if the network request is returned. The context and time triggers in the callback function vary, and the application requirements in jquery are most often the case. For example, I clicked on a button, which is the content of a TR in TD that I can use to determine any property of the current row, or to determine any property in the current face, as long as the layout of the page is some sort of controllable filter. Need to be practical to this keyword. There is also the find () method. such as This.parent (). Find (' Tr:eq (3) '); This is the 3rd element found in all of the TR.

Here are two examples of JS functions, the first is the focus is on the acquisition of the necessary content, through jquery can easily get the content of the elements we need. Then use this content to implement other functions, colleagues also use jquery way to operate the page, jquery in the page display of the powerful role, can be seen. The second function is primarily to invoke the specified interface through jquery ajax, complete the data operation, and then update the data on the page. The purpose of Ajax is to update the page locally, and sometimes it is inconvenient to refresh the page.

function Openrej () {//The other content of the current link's peer is found through jquery, and here is the ID.
ID = $ (this). Parent (). Parent (' TR '). Find (' td:eq (0) '). html ();
$ ("#TB_overlayBG"). CSS ({display: "Block", height:$ (document). Height ()}); $ (". Box"). CSS ({left: ($ (' body '). Width ()-$ (". Box"). Width ())/2-20+ "px", Top: ($ (window). Height ()-$ (". Box"). Height ()
)/2+$ (window). scrolltop () + "px", Display: "Block"});
current_id = ID; //Click a time to start this function to make the page local more function Doreject () {var obj = $ (". Box input:checked"); var rej_reason = '; var other = $ ("#o
Therbox #other_reject_reason "). Val ();
Rej_reason + = "'" +other; if (Rej_reason = = "" ") {Window.alert (' Pro, at least to fill out a reason Oh!
');
return;
The URL = "youurl?id=" +current_id+ "&reject_reason=" +rej_reason;
$.getjson (url,function) {//data is what is obtained from the request. if (data.msg = = true) {//Update data in current line. Color = Get_color (data.status); $ ("#rej_reason" +current_id). Text (DAT
A.rea);
Status_text = Gen_status_text (data.status);
Update the corresponding content in the page.
$ ("#status" +current_id). Text (Status_text); $ ("#status" +current_id). CSS (' Color ',color);
Perform other operations Closeceng (); 
}else {alert (' update failed ');}}); }