Question

我循环遍历json数组并将其一些值附加到div。循环工作正常。但是当我在json中有多个值时。它仅附加最后一个值。

这是我的json

{"msg":[{"id":22,"created_at":"2017-01-16 08:57:43","updated_at":"2017-01-16 08:57:43","profile_name":"VFX DESIGNER","experience":"0-2","skill":"s:10:\"MYSQL,JAVA\";","user_id":"2","comments":"sadsads","aptitude":"yes"},
{"id":23,"created_at":"2017-01-16 08:57:43","updated_at":"2017-01-16 08:57:43","profile_name":"MAYA ","experience":"0-2","skill":"s:10:\"MYSQL,JAVA\";","user_id":"2","comments":"sadsads","aptitude":"yes"}]}

当我循环获取配置文件名称时，它在第二个值中仅显示MAYA。和VFX DESIGNER没有附加。

$.each(data,function(key,value){
        $.each(value,function(index,titleObj){
            $("#profiles_name ul").empty();
            $("#profiles_name ul").append("<a  href = javascript:getCandidates(this) data-value = "+titleObj.user_id+"/"+titleObj.id+"><li>"+titleObj.profile_name+"</li></a><li class = divider></li>");
        });
    });

Answer 1

因为您正在使用("#profiles_name ul").empty();在每次迭代中，它会移除("#profiles_name ul")中的所有内容，然后附加新的a。

在第一个empty()之前使用each，它会清理您的元素，然后迭代数据。

$("#profiles_name ul").empty();

$.each(data,function(key,value){
   $.each(value,function(index,titleObj){
      $("#profiles_name ul").append("<a  href = javascript:getCandidates(this) data-value = "+titleObj.user_id+"/"+titleObj.id+"><li>"+titleObj.profile_name+"</li></a><li class = divider></li>");
   });
});

Answer 2

尝试

$("#profiles_name ul").empty();
$.each(data,function(key,value){
        $.each(value,function(index,titleObj){

            $("#profiles_name ul").append("<a  href = javascript:getCandidates(this) data-value = "+titleObj.user_id+"/"+titleObj.id+"><li>"+titleObj.profile_name+"</li></a><li class = divider></li>");
        });
    });

在循环前清空profiles_name ul

Answer 3

创建一个字符串，然后附加它以获得所需的输出。

var str = "";
$.each(data,function(key,value){
    $.each(value,function(index,titleObj){
        str +="<a  href = javascript:getCandidates(this) data-value = "+titleObj.user_id+"/"+titleObj.id+"><li>"+titleObj.profile_name+"</li></a><li class = divider></li>";
    });
});

$("#profiles_name ul").empty();
$("#profiles_name ul").append(str);

Answer 4

是的，因为在每个循环中你将UL设为空，然后附加新创建的html ... 所以：只有一次空UL：

$("#profiles_name ul").empty();

然后遍历数据并将html追加到它：

$.each(data,function(key,value){
        $.each(value,function(index,titleObj){

            $("#profiles_name ul").append("<a  href = javascript:getCandidates(this) data-value = "+titleObj.user_id+"/"+titleObj.id+"><li>"+titleObj.profile_name+"</li></a><li class = divider></li>");
        });
    });

希望这会对你有所帮助

循环遍历Json数组Jquery时仅追加最后一个值

4 个答案: