迭代并显示来自json的数据

时间:2014-02-01 15:07:21

标签: jquery json

我的php文件中的json对象是

echo json_encode(array('uname'=>$fname,'Oname'=>$pi['name'],'osize'=>$size));

我试图在客户端使用以下jquery循环它,但是它只显示list中的一条记录。我可以改善它以便正常工作

function work(i,fly,response){
                 _outfilenames=[];
        //$.each(response, function() {


         _outfilenames.push("<li>" +"<div ><a href='#'            data-name='"+response.uname +"'><img src='stop.png' ></a></div>"+ "<span class='filename'>" +response.Oname+ "</span> "  +"<span class='details'>size:</strong>"+response.size +" </span>" +"</li>");

        $(_outfilenames.join('')).appendTo("#flist");

响应很好,当我像这样检查时

names=[];names.push(response.Oname);

肯定会得到数据。但为什么outfilenames变量只给我一个list.i尝试过使用每个但仍然无法让它工作。请帮助

这是我更新的代码:

function work(i,fly,response){
var cookedJSON=[];cookedJSON.push({ uname : response.uname , Oname : response.Oname , osize :response.osize });
         _outfilenames=[];
$.each(cookedJSON, function(i,arr) {

      _outfilenames.push("<li id='group_0_file_"+i+"'class='image-list'>" +"<div class='controls' title='remove file'><a href='#' class='image-list' data-filename='"+arr.uname +"'><img src='stop.png' ></a></div>"+   "<span class='filename'>" +arr.Oname+ "</span> "  +"<span class='details'>size:</strong>"+arr.osize +" </span>" +"</li>");//}
});  // close each()
$(_outfilenames.join('')).appendTo(f_list);

1 个答案:

答案 0 :(得分:1)

老实说,首先看不出问题。也许需要见到你json。 +我不知道你如何迭代列表。

这是我的样本http://jsfiddle.net/fLTxK/

仅供测试:

var cookedJSON = [];
for (var i = 0; i < 10; i+=1)
{
    cookedJSON.push({ uname : 'uname' + i, Oname : 'Oname' + i, size : 'size' + i});
}

和代码:

var _outfilenames = [], response = '';
for (i = 0; i < 10; i+=1)
{
    response = cookedJSON[i];
_outfilenames.push("<li>" +"<div ><a href='#'            data-name='"+response.uname +"'><img src='stop.png' ></a></div>"+ "<span class='filename'>" +response.Oname+ "</span> "  +"<span class='details'>size:</strong>"+response.size +" </span>" +"</li>");
}
$(_outfilenames.join('')).appendTo("body");

另外,我会说,我不喜欢制作模板的难度,使用像Mustache这样的引擎。但这取决于你