如何将结果从 JSON 放入 DIV？答案

【问题标题】：How to put result into DIV from JSON?如何将结果从 JSON 放入 DIV？
【发布时间】：2013-01-17 09:46:06
【问题描述】：

从下面的函数我得到了结果。现在我想将该结果放入一个 div 中。那么我应该如何将结果放入一个 div 中呢？

$(document).ready(function () {
    $.ajax({
        type: "POST",
        url: "../ajaxaction.php",
        data: {
            action: 'alllist'
        },
        dataType: 'json',
        success: function (msg) {
            for (var i = 0; i < msg.length; i++) {
                var uname = msg[i].user_name;
                var vtitle = msg[i].video_title;
                var vid = msg[i].video_id;
                var vthumb = msg[i].video_thumb;
            }
        }
    });

});

【问题讨论】：

你在这里尝试了什么？我可以看到您的变量，但您也可以添加您的 HTML，因为我在任何地方都看不到 DIV 吗？
正如我从您的代码中看到的那样，您循环遍历列表，将每条记录的 put 值放入一些本地值中，每次都覆盖它们...
如果您需要在某些潜水内显示页面上的所有列表，我建议使用如下内容：$('body').append('
')

标签： javascript jquery json jquery-ui

【解决方案1】：

您可以使用您喜欢的格式将结果附加到 div 中，但添加的方法很简单。您可以使用append() 函数为循环的每次迭代保留添加的html和新的html。

  success: function(msg){ 
       for (var i = 0; i < msg.length; i++) { 
        var uname = msg[i].user_name;
        var vtitle = msg[i].video_title;
        var vid = msg[i].video_id; 
        var vthumb = msg[i].video_thumb;
         $('#divId').append("Name: " + uname + "," + "Title: " + vtitle +
                            "Id: " + vid + "," + "Thumb: " + vthumb + "<br />");
       }

【讨论】：

【解决方案2】：

$(document).ready(function() { 
    $.ajax({
       type: "POST",
       url: "../ajaxaction.php",
       data: { action:'alllist'},
       dataType: 'json',
       success: function(msg){ 
       for (var i = 0; i < msg.length; i++) { 
        var uname = msg[i].user_name;
        var vtitle = msg[i].video_title;
        var vid = msg[i].video_id; 
        var vthumb = msg[i].video_thumb;

        $("#container").html("Username: " + uname + "<br />Video Title: " + vtitle + "<br />Vide ID: " + vid + "<br />Video Thumb: " + vthumb);
       }


   }});

});

【讨论】：

【解决方案3】：

如果你的 div 存在：

jQuery('div selector').append(uname+' '+vtitle+...whatever variable and format);

如果没有

jQuery('element selector to put the div in').append('<div id="aID" class="some classes">'+uname+' '+vtitle+...whatever variable and format...+'</div>');

【讨论】：

【解决方案4】：

你可以这样做：

success: function(msg){ 
   $.each(msg, function(i, item){
      $('#divid').html('User Name : '+item.user_name+ 
                       'Video title : '+item.video_title+
                       'Video Id : 'item.video_id+
                       'Video Thumb : 'item.video_thumb );
      });
}

【讨论】：