如何在phonegap中以li格式显示json内容 [英] how to display json content in li format in phonegap

问题描述

我可以用以下格式获得json

i can get the json in the following format

[{"data":{"id":"1","user_name":"StudentA","book":"123","role":"Student"}},
{"data":{"id":"3","user_name":"StudentB","book":"456","role":"Student"}}]

我如何使用数据呈现如下图所示，其中第一行是用户名，第二行是book

how can i use the data to present like the image below, where the first line is username and second line is book

<button type="button" id="test">Test 123</button>

 <ul id="studentList" data-role="listview" data-filter="true"></ul>

var serviceURL = "http://mydomain.com/";
var students;

    $("#test").click(function()
    {   
        getStudentList();
    });
function getStudentList() {
    $.getJSON(serviceURL + 'getStudents.php', function(data) {
        $('#studentList li').remove();
        students = data.user_name;
        $.each(students, function(index, student) {
            $('#studentList').append('<li>' +
                    '<h4>' + student.user_name + ' ' + student.password + '</h4>' +
                    '<p>' + student.user_name + '</p>' +
                    '</li>');
        });
        $('#studentList').listview('refresh');
    });
}

我可以问上面的代码是否正确？

may i ask if the codes above correct?

推荐答案

您将响应命名为 data ..因为您的响应在数组 你必须循环数据第一..获得其对象，它是数据再次..

you are naming response as data..since you response is in array [] you have to loop data first.. get its object which is data again ..

[{"data":{"id":"1","user_name":"StudentA","book":"123","role":"Student"}},
//-^^^^---here

在循环中获取相应的名称和密码对象...您可以通过。运算符来获得。 c> operator .. so inside loop， student.data.user_name 为您提供用户名， student.data.book 为您提供书籍和类似内容...

and get the correponding name and password object in the loop...you can get that by . operator.. so inside loop, student.data.user_name gives you username , student.data.book gives you book and similar for others...

试试这个...

$.getJSON(serviceURL + 'getStudents.php', function(data) {
    $('#studentList li').remove();
  //students = data.user_name;
    $.each(data, function(index, student) {
        $('#studentList').append('<li>' +
                '<h4>' + student.data.user_name +'</h4>' +  //here get username
                '<p>' + student.data.book + '</p>' +   //here get book
                '</li>');
    });
    $('#studentList').listview('refresh');
});

这篇关于如何在phonegap中以li格式显示json内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！