Learning jquery preliminary study notes (six)

jquery study notes six

Introduction to AJAX

AJAX is a technology to exchange data with the server, it is without reloading the entire page, to achieve the update part of the page.

load () method

load () method to load data from the server, and the return of data into the selected element.

grammar

$(selector).load(URL,data,callback)
  • URL parameters necessary specifications URL you want to load.
  • The query string parameters predetermined key optional data transmitted together with the request / value pairs.
  • Optional callback parameter is a function name of the load () method completes performed.

Examples
1. Load link files

$(document).ready(function(){
    $("button").click(function(){
        $("#div1").load("/try/ajax/demo_test.txt");
    });
});

2. Load the linked file specified content labels

$("#div1").load("demo_test.txt #p1");

3.callback parameters when a predetermined load () method after completion of a callback function to be allowed. The callback function can set different parameters

  • responseTxt - contains the result when the contents of the call is successful
  • statusTXT - state calls included
  • xhr - contains the XMLHttpRequest object
$("button").click(function(){
  $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
    if(statusTxt=="success")
      alert("外部内容加载成功!");
    if(statusTxt=="error")
      alert("Error: "+xhr.status+": "+xhr.statusText);
  });
});

HTTP request: GET vs. POST

  • For obtaining substantially GET (retrieve) data from the server
  • POST may also be used to obtain data from the server

$ .Get () method

grammar

$.get(URL,callback);
  • URL parameters necessary specifications URL you want to request.
  • The optional callback parameter is the name of the function executed after the request is successful.
  • The following example uses $ .get () methods to retrieve data from a file on the server:

example

("button").click(function(){
  $.get("demo_test.php",function(data,status){
    alert("数据: " + data + "\n状态: " + status);
  });
});

$ .get () The first parameter is the URL we want to request ( "demo_test.php").
The second parameter is a callback function. There is a first callback parameter requested content page, the second correction parameter there status request.

$ .Post () method

grammar

$.post(URL,data,callback);
  • URL parameters necessary specifications URL you want to request.
  • The optional data parameter predetermined data sent along with a request.
  • The optional callback parameter is the name of the function executed after the request is successful.
  $.post("/try/ajax/demo_test_post.php",
    {
        name:"小明",
        url:"http://www.baidu.com"
    },
        function(data,status){
        alert("数据: \n" + data + "\n状态: " + status);
    });

Prevent conflict

jQuery using $ symbols as shorthand for jQuery

noConflict () method

Release identifier control

$.noConflict();
jQuery(document).ready(function(){
  jQuery("button").click(function(){
    jQuery("p").text("jQuery 仍然在工作!");
  });
});

Create your own shorthand

var jq = $.noConflict();
jq(document).ready(function(){
  jq("button").click(function(){
    jq("p").text("jQuery 仍然在工作!");
  });
});

Guess you like

Origin www.cnblogs.com/mengxiaoleng/p/11390837.html
Recommended