Explication détaillée de l'utilisation de $.get, $.post, $.getJSON et $.ajax dans jQuery

L'objectif de ce chapitre est de parler des quatre méthodes d'appel d'ajax dans jQuery : $.get, $.post, $getJSON, $ajax.

Quand nous sommes "heureux" d'écrire des programmes ajax en javascript, tout à coup quelqu'un vous dit qu'il existe un truc appelé jquery, qui vous dira à quel point il est heureux de ne pas interagir directement avec HttpRequest, et en même temps Ce qui est encore mieux, c'est que votre code js sera grandement simplifié. Après avoir lu cet article, vous constaterez qu'ajax n'est qu'une question d'une phrase.

1. $.get

La méthode $.get() utilise la méthode GET pour effectuer des requêtes asynchrones. Sa structure syntaxique est :

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

Expliquez les différents paramètres de cette fonction :

url : type de chaîne, l'adresse de la requête ajax.

data : paramètre facultatif, type d'objet. Les données clé/valeur envoyées au serveur seront ajoutées à l'URL de la requête en tant que QueryString.

callback : paramètre facultatif, type de fonction, cette fonction est automatiquement appelée lorsque ajax revient avec succès.

Enfin, écrivez un exemple de $.get() pour votre référence :

$.get(
    "submit.aspx",{
        id:     '123',
        name:   '青藤园',
    },function(data,state){
        //这里显示从服务器返回的数据
        alert(data);
        //这里显示返回的状态
        alert(state);
    }
)

2.$.post()

$.post() utilise la méthode POST pour effectuer des requêtes asynchrones. Sa structure syntaxique est la suivante :

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

Cette méthode est similaire à $.get(), sauf qu'il existe un paramètre de type supplémentaire, puis Ici, nous introduisons uniquement le paramètre type. Pour d'autres informations, veuillez vous référer à $.get() ci-dessus.

type : type est le type de données demandé, qui peut être html, xml, json, etc. Si nous définissons ce paramètre sur : json, alors le format renvoyé sera au format json. S'il n'est pas défini, il. sera le même que Le format renvoyé par $.get() est le même, les deux sont des chaînes.

Enfin, écrivez un exemple de $.post() pour votre référence :

$.post(
    "submit.aspx",{
        id:     '123',
        name:   '青藤园',
    },function(data,state){
        //这里显示从服务器返回的数据
        alert(data);
        //这里显示返回的状态
        alert(state);
    },
    "json"
)

3 $.getJSON()

$. getJSON() est spécialement configuré pour ajax pour obtenir des données json et prend en charge les appels inter-domaines :

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

url : type de chaîne, données d'adresse de requête d'envoi : paramètre facultatif, à être. Envoyer des paramètres clé/valeur, identiques au rappel de données de type get et post : paramètre facultatif, fonction de rappel lorsque le chargement est réussi, identique au rappel de type get et post

JSON est un format de transmission de données idéal. intégré à JavaScript ou à d'autres langages hôtes, et peut être utilisé directement par JS. L'utilisation de JSON est structurellement plus raisonnable et plus sûre que l'envoi de données « nues » directement via GET et POST. Quant à la fonction getJSON() de jQuery, il s'agit simplement d'une version simplifiée de la fonction ajax() avec des paramètres JSON définis. Cette fonction peut également être utilisée sur plusieurs domaines et présente certains avantages par rapport à get() et post(). De plus, cette fonction peut permettre au programme d'exécuter la fonction de rappel X en écrivant l'URL de la requête au format "myurl?callback=X".

4. $.ajax()

$.ajax() est un package ajax courant dans jquery. Son format de syntaxe est :

$.ajax(options);

Les options sont un type d'objet, qui spécifie les paramètres spécifiques de cet appel ajax. Ici, je joins les paramètres les plus couramment utilisés

$.ajax({
        url: 'submit.aspx',
        datatype: "json",
        type: 'post',
        success: function (e) {   //成功后回调
            alert(e); 
        },
        error: function(e){    //失败后回调
            alert(e);
        },
        beforeSend: function(){  /发送请求前调用，可以放一些"正在加载"之类额话
            alert("正在加载");
        }
})

Ce qui précède explique comment jquery implémente la méthode des appels ajax, les appels ajax. assez compliqué. J'espère que ce chapitre pourra être utile à tout le monde. Pour plus de tutoriels connexes, veuillez visiter

Tutoriel vidéo jQuery, Tutoriel vidéo AJAX !