jQuery $.get $.post $.getJSON and $.ajax usage explanation

  • 2020-03-30 04:21:39
  • OfStack

when we write in javascript ajax program writes very "happy", suddenly someone tell you, there is a thing called jquery, it will tell you not directly and HttpRequest how happy it is, at the same time, you don't need to worry about tangle ajax garbled problem, more happiness is your js code is greatly simplified, finish see this article, you will find that ajax, simple, is a word.

1, $.get

$.get() methods use the GET method to make an asynchronous request, its syntax structure is:

$.get( url [, data] [, callback] )

to explain the function of the various parameters:

url: string type, ajax request address.

data: optional parameter, object, key/value data sent to the server will be appended to request URL as QueryString.

callback: optional, of type function, which is automatically called when ajax returns success.

finally write an instance of $.get() for your reference:


$.get(
    "submit.aspx",{
        id:     '123',
        name:   ' Green garden ',
    },function(data,state){
        // This shows the data returned from the server
        alert(data);
        // This shows the returned status
        alert(state);
    }
)

2, $.post()

$.post() method use POST way to asynchronous request, its syntax structure is:

$.post(url,[data],[callback],[type])

this method and $.get() usage is similar, only one more type parameter, so here only introduce type parameter, other reference above $.get().

type: type is the requested data type, which can be html,xml,json, etc. If we set this parameter to: json, then the format returned is in the format of json, if not set, as the format returned by $.get(), is a string.

finally write an instance of $.post() for reference:


$.post(
    "submit.aspx",{
        id:     '123',
        name:   ' Green garden ',
    },function(data,state){
        // This shows the data returned from the server
        alert(data);
        // This shows the returned status
        alert(state);
    },
    "json"
)

3, $.getJSON()

$.getJSON() is specially set for ajax to obtain json data, and support cross-domain call, its syntax format is:

getJSON(url,[data],[callback])

url: string type, send request address   data : Optional parameter, to send Key/value parameter , with get, post type data callback : optional parameter, with get, post type data callback : optional parameter, with get, post type callback

JSON is an ideal data transfer format, it can be well fused with JavaScript or other host language, and can be used directly by JS. Using JSON is structurally more reasonable and safer than sending "naked" data directly via GET and POST. As for the getJSON() function of jQuery, it is only a simplified version of the ajax() function with the JSON parameter set. This function can also be used across domains and has some advantages over get() and post(). In addition, this function can ask the program to perform the callback function X by writing the request url to into "myurl?callback=X".

4 and $.ajax()

$.ajax() are common ajax packages in jquery, and their syntax is:

$.ajax(options)

options is a object type, it pointed out the specific parameters of the ajax call here I put the most commonly used several parameters is attached above


$.ajax({
        url: 'submit.aspx',
        datatype: "json",
        type: 'post',
        success: function (e) {   // Callback after success
            alert(e);
        },
        error: function(e){    // Callback after failure
            alert(e);
        },
        beforeSend: function(){  / Call before sending a request, can put some " Being loaded " Such as the forehead words
            alert(" Being loaded ");
        }
})

jquery implementation ajax call several methods of ajax calls is quite complicated, I hope this article can help you, if you have any questions, also can contact me, we make progress together.


Related articles: