检索json数据并显示

Question

我在动态显示json数据时遇到了一些问题。我有超过80行的数据。当我试图动态显示名称时，所有名称都变得相同。即，它采取列表中的最后一个数据

＆＃13;

＆＃13;

$(".mem-wrap").each(function(){
	var url ="welcome/fetchdata";
	var mm = $(this).parent().attr('data-id');

	$.ajax({
	url: url,
	data: "id="+mm,
     context: document.body
	}).done(function(data) {
		var data3 = JSON.parse(data);
		console.log(mm+"  "+"  "+data3.results[0].name);
		console.log($(this).find('.name').html());
		$(this).find('.name').text(data3.results[0].name);
	      

	});
});

＆＃13;

<div class="team-wrap-2" data-id="2" > 
  <img src="images.." alt="" />
                <div class="mem-wrap">
                  <div class="mem-name-wrap">
                    <h2 class="name">abcd</h2>
                    <h3 class="des">sfgh</h3>
                  </div>
                  <div class="clear"></div>
                </div>
                <div class="clear"></div>
              </div>
              <div class="team-wrap-2" data-id="3" > 
                <img src="images/team/...." alt="" />
                <div class="mem-wrap">
                  <div class="mem-name-wrap">
                    <h2 class="name"></h2>
                    <h3 class="des"></h3>
                    <div class="clear"></div>
                  </div>
                  <div class="clear"></div>
                </div>
                <div class="clear"></div>
              </div>
              <div class="team-wrap-2" data-id="4" > <img src="images/team/thumb/mem.jpg" alt="" />
                <div class="mem-wrap">
                  <div class="mem-name-wrap">
                    <h2 class="name">fdg</h2>
                    <h3 class="des">sfdsf</h3>
                    <div class="clear"></div>
                  </div>
                  <div class="clear"></div>
                </div>
                <div class="clear"></div>
              </div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

您需要添加for循环。像这样：

$(".mem-wrap").each(function(){
var url ="welcome/fetchdata";
var mm = $(this).parent().attr('data-id');

$.ajax({
url: url,
data: "id="+mm,
 context: document.body
}).done(function(data) {
    for(var i=0;i<data.length;i++){

   } 
});
});

Answer 2

您没有迭代结果集索引。

试试这个

   
    $(".mem-wrap").each(function(){
        	var url ="welcome/fetchdata";
        	var mm = $(this).parent().attr('data-id');
            
        	$.ajax({
        	url: url,
        	data: "id="+mm,
             context: document.body
        	}).done(function(data) {
               for(var i=0 ;i<data.length;i++){
        		var data3 = JSON.parse(data);
        		console.log(mm+"  "+"  "+data3.results[i].name);
        		console.log($(this).find('.name').html());
        		$(this).find('.name').text(data3.results[i].name);
             }
        	      

        	});
        });

    <div class="team-wrap-2" data-id="2" > 
          <img src="images.." alt="" />
                        <div class="mem-wrap">
                          <div class="mem-name-wrap">
                            <h2 class="name">abcd</h2>
                            <h3 class="des">sfgh</h3>
                          </div>
                          <div class="clear"></div>
                        </div>
                        <div class="clear"></div>
                      </div>
                      <div class="team-wrap-2" data-id="3" > 
                        <img src="images/team/...." alt="" />
                        <div class="mem-wrap">
                          <div class="mem-name-wrap">
                            <h2 class="name"></h2>
                            <h3 class="des"></h3>
                            <div class="clear"></div>
                          </div>
                          <div class="clear"></div>
                        </div>
                        <div class="clear"></div>
                      </div>
                      <div class="team-wrap-2" data-id="4" > <img src="images/team/thumb/mem.jpg" alt="" />
                        <div class="mem-wrap">
                          <div class="mem-name-wrap">
                            <h2 class="name">fdg</h2>
                            <h3 class="des">sfdsf</h3>
                            <div class="clear"></div>
                          </div>
                          <div class="clear"></div>
                        </div>
                        <div class="clear"></div>
                      </div>