The instructions for using the json data called ajax in jquery

$.get() and $.post ()

• Scenario 1: $.post ("url", function); T he data returned at this time is not processed, so it is not in the johnson format!
  
• Scenario 2: $.post ("url", function, "json"); A t this point, although the returned data is specified as jason format, it is not!
  
• Scenario 3: $.post ("url", "," function); T he incoming parameters are empty at this point and the returned data format is not specified, so it is not the johnson format!
  
• Scenario 4: $.post ("url", s, function, "json"); T he data in the jason format is returned correctly!
  

Key points: get the jason format data in the way of get, is $.get () convenient to write it!

jQuery Ajax usage is detailed

jQuery Ajax is very common in web application development, it mainly includes ajax, get, post, load, getscript and so on, these commonly used no-refresh operation methods, when dealing with complex ajax requests, jQuery uses jQuery.ajax() method to handle.

There are some simple methods in jQuery that encapsulate the jQuery.ajax() method so that we don't need to use the jQuery.ajax() method when dealing with some simple Ajax events.

The following 5 methods perform a short form of a general Ajax request and should use jQuery.ajax() when handling complex Ajax requests.

1.load(url,[data],[callback])

Load the remote HTML file code and insert it into the DOM, which is automatically converted to POST by passing parameters using getT by default.

• url: The remote url address to load
  
• data: Key/value data sent to the server
  
• Callback: A callback function when loaded successfully
  

//无参数、无回调函数
$("#showload").load("load.htm");
//无回调函数
$("#showload").load("load.htm", { "para": "para-value" });
$("#showload").load("load.htm", { "para": "para-value" },
    function() {
        //处理
    })

The contents of the loaded file will be displayed here

2.jQuery.get(url, [data], [callback])

• The URL address at which the request was sent
  
• The data to send to the server
  
• The callback function on successful load
  

The sample code is as follows:

$.get("jqueryget.htm", { "id": this.id },
    function(req) {
        //成功时的回调方法
        $("#showget").html(req);
    });
})

Using the $.get() method, you get different logos by passing the id. It's worth noting that the request is obtained through the get method at this point, so use Request.QueryString when getting parameter values, and you can see the difference between Request Request.QueryString

3. Baidu logo Google logo

Here will logo3.jQuery.post (url, s data), callback)
Use POST to make asynchronous requests. The difference with jQuery.get() is the way it is requested, so it's not specifically explained here that the usage method is similar to jQuery.get().

4.jQuery.getScript(url,[callback])

Request a JavaScript file to be loaded and executed via GET. This technique, which has been mentioned in previous articles, is also a simple way to use jQuery.ajax, and you can look at ajax loading js, so it's not particularly explained here.

5.jQuery.getJSON(url,[data],[callback])

The sample code is as follows:

$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(req) {
    $.each(req.items, function(i, item) {
        if (i == vnum) {
            $("<img src="" + item.media.m + "" title="" + item.title + "" />").appendTo("#showjson");
        }
    });
});

Again, this is a short-form approach to the jQuery.ajax() approach, similar to the following:

List of parameters:

function (XMLHttpRequest) {  this; // the options for this ajax request}

function (XMLHttpRequest, textStatus) {  this; // the options for this ajax request}

function (XMLHttpRequest, textStatus, errorThrown) {  // 通常情况下textStatus和errorThown只有其中一个有值   this; // the options for this ajax request}

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. /b12>We can define these events to handle each of our Ajax requests well. Note that the this in these Ajax events is a picture of the thiss that points to the option information requested by Ajax (see the this picture when you say get() method).

The code is as follows:

$.ajax({
  url: url,
  dataType: 'json',
  data: data,
  success: callback
});

Maybe you haven't used jason data yet, my small station has mentioned the use of jason several times, if you are not familiar with the json format, you can look at the value of jquery mobile listbox, jQuery under the use of json examples

Get jason data

Here will randomly display a json data so far we have summarized the jQuery.ajax five short-form methods, let's focus on the jQuery.ajax() method, in use, the author is also often used jQuery.ajax(), because in most cases, we need to axaj request error situation to capture and deal with.

6.jQuery.ajax()

The code is as follows:

$.ajax({
    url: "http://www.hzhuti.com",    //请求的url地址
    dataType: "json",   //返回格式为json
    async: true, //请求是否异步，默认为异步，这也是ajax重要特性
    data: { "id": "value" },    //参数值
    type: "GET",   //请求方式
    beforeSend: function() {
        //请求前的处理
    },
    success: function(req) {
        //请求成功时处理
    },
    complete: function() {
        //请求完成的处理
    },
    error: function() {
        //请求出错处理
    }
});

Use jQuery.ajax()
The data is displayed here.

$.ajax practical application example:

//1.$.ajax带json数据的异步请求
var aj = $.ajax( {  
    url:'productManager_reverseUpdate',// 跳转到 action  
    data:{  
             selRollBack : selRollBack,  
             selOperatorsCode : selOperatorsCode,  
             PROVINCECODE : PROVINCECODE,  
             pass2 : pass2  
    },  
    type:'post',  
    cache:false,  
    dataType:'json',  
    success:function(data) {  
        if(data.msg =="true" ){  
            // view("修改成功！");  
            alert("修改成功！");  
            window.location.reload();  
        }else{  
            view(data.msg);  
        }  
     },  
     error : function() {  
          // view("异常！");  
          alert("异常！");  
     }  
});

//2.$.ajax序列化表格内容为字符串的异步请求
function noTips(){  
    var formParam = $("#form1").serialize();//序列化表格内容为字符串  
    $.ajax({  
        type:'post',      
        url:'Notice_noTipsNotice',  
        data:formParam,  
        cache:false,  
        dataType:'json',  
        success:function(data){  
        }  
    });  
} 

//3.$.ajax拼接url的异步请求
var yz=$.ajax({  
     type:'post',  
     url:'validatePwd2_checkPwd2?password2='+password2,  
     data:{},  
     cache:false,  
     dataType:'json',  
     success:function(data){  
          if( data.msg =="false" ) //服务器返回false，就将validatePassword2的值改为pwd2Error，这是异步，需要考虑返回时间  
          {  
               textPassword2.html("<font color='red'>业务密码不正确！</font>");  
               $("#validatePassword2").val("pwd2Error");  
               checkPassword2 = false;  
               return;  
           }  
      },  
      error:function(){}  
});

//4.$.ajax拼接data的异步请求
$.ajax({   
    url:'<%=request.getContextPath()%>/kc/kc_checkMerNameUnique.action',   
    type:'post',   
    data:'merName='+values,   
    async : false, //默认为true 异步   
    error:function(){   
       alert('error');   
    },   
    success:function(data){   
       $("#"+divs).html(data);   
    }
});