Maison >interface Web >js tutoriel >jQuery ajax json code de traversée des données

jQuery ajax json code de traversée des données

高洛峰original: 2017-01-12 09:36:021489parcourir

Laissez-moi d'abord vous expliquer mes besoins : après avoir effectué une requête ajax, les données json suivantes sont renvoyées en arrière-plan.

Le code d'implémentation spécifique est le suivant :

Code JavaScript

{
"data":[
{"id":"1","name":"选择A","value":"A"},
{"id":"2","name":"选择B","value":"B"},
{"id":"3","name":"选择C","value":"C"}
]
}

Analyser la classe de données json ci-dessus dans la fonction de réussite de jquery

JavaScript Code

$.ajax({
type: "POST",
url: "xxx.do",
dataType : "json", // 指定返回类型
data: {xxx:"yyy"}, // 传递到后台的参数
success: function(data)
{
$.each(data, function(index,values){ // 解析出data对应的Object数组
$.each(values,function(index2,value){ // 遍历Object数组 ，每个对象的值存放在value ，index2表示为第几个对象
// 根据自己的逻辑进行数据的处理
alert(value.name + " " + value.value);
// TODO: 逻辑
});
});
},
error : function()
{
alert("系统出现问题");
}
});

Continuons avec un exemple

Ce chapitre partage un exemple de code, qui est le traitement des requêtes ajax pour les données JSON encapsulées par jQuery.
Le code est relativement simple et peut être parcouru par du personnel expérimenté. Les débutants peuvent l'utiliser comme référence.
Le code est le suivant :

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<title>PHP中文网</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script>
$(document).ready(function(){
 $("#bt").click(function(){
  $.ajax({
   type: "get",
   dataType: "json",
   url: "demo/jQuery/ajax/txt/json.txt",
   success: function(msg){
    var data = msg
    str="";
    $.each(data,function(index, n){
     str=str+data[index].webName+","+data[index].url+","+data[index].age+"<br/>";
    });
    $("#show").html(str);
   }
  });
 })
})
</script>
</head>
<body>
<div id="show"></div>
<input type="button" id="bt" value="查看效果"/>
</body>
</html>

Ce qui précède est le code de traversée de données jQuery ajax json introduit par l'éditeur. J'espère qu'il vous sera utile. Si vous avez des questions, veuillez partir. moi un message. L'éditeur répondra à tout le monde à temps. Je voudrais également vous remercier tous pour votre soutien au site Web PHP chinois !

Pour plus d'articles sur le code de traversée de données jQuery ajax json, veuillez faire attention au site Web PHP chinois !

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Exemple de code json ajax et traversal array de jQueryArticle suivant：Exemple de code json ajax et traversal array de jQuery

Articles Liés

Voir plus