Question

我查看了有关此问题的较旧帖子，但未找到问题的解决方案。

我的计算机上有2个REST服务，1个用于登录，第2个用于发送列表项。

我可以使用登录网络服务进行连接和登录。我的第二个Web服务在登录后调用，它以下列形式提供JSON数据..

[{“oid”：101，“summary”：“这是我的第一个订单”}，{“oid”：102，“摘要”：“这是第二顺序”}]

我想解析这个JSON字符串并创建一个“oid”列表然后如果我点击第一项我应该在新页面上看到“摘要”。当我点击后退按钮时，我想再次调用该服务，以便列表刷新。

这是我试过的代码。

<script>
    $.getJSON('http://192.168.2.36:8080/phoneservlet/getOrders', function(data){
            var output = '';


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

    //add each value to the output buffer (we also have access to the other properties of this object: id, start, and end)
    output += '<li>'+ value.oid +'</li>';
    });

    //now append the buffered output to the listview and either refresh the listview or create it (meaning have jQuery Mobile style the list)
    $('#your-orders').append(output).listview('refresh');//or if the listview has yet to be initialized, use `.trigger('create');` instead of `.listview('refresh');`
    });

    </script>

这是列表

<div data-role="page" id="currentorders">
<div data-role="content" id="data">
<ul data-role="listview" id="your-orders" data-divider-theme="b" data-inset="true">List of Orders</ul>
</div>

问题是我的列表没有填充。我看到一个空列表，其中只有我的列表标题，即“订单列表”

我是jquery的新手，所以我仍然没有想出如何在新页面上显示摘要..

Answer 1

我认为您可能错过了config.xml文件中的以下访问规则：

<access origin="*" />

Answer 2

1）对于第一个问题，你需要检查get json url

2）第二期在新页面上显示摘要

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
</head>
<body>
<div data-role="page" id="currentorders">
    <div data-role="header">
        <h1>Orders</h1>
    </div>
    <div data-role="content">
      <ul data-role="listview" id="your-orders" data-divider-theme="b" data-inset="true"></ul>
    </div>
</div> 
<div data-role="page" id="summary">
    <div data-role="header">
        <a href="" data-rel="back" id="back" data-transition="slide" data-direction="reverse">Back</a>
        <h1>Summary</h1>
    </div>
    <div data-role="content" id="content">         
    </div>
</div> 
</body>
<script>
$('#currentorders').live("pageshow", function(){
    // Here obj get using $.getJSON function, I have done direct using your json object only for example 
    var obj = [{"oid":101,"summary":"this is my first order"},{"oid":102,"summary":"this is second order"}];
    var list = "";
    $.each(obj, function(key, value){            
        list += '<li class="row"><a href=""  data-role="none" data-title="'+value.summary+'" data-transition="slide">'+value.oid+'</a></li>';
    })
    $('#your-orders').html(list).trigger('create');
    $('#your-orders').listview('refresh')
})

$('#currentorders li a').live("click",function(){
    var content = $(this).attr("data-title");
    $("#summary #content").html(content);
    $.mobile.changePage( "#summary", { transition: "slide", changeHash: false });
}) 

$('#summary #back').live("click",function(){
    $.mobile.changePage( "#currentorders", { transition: "slide", reverse: true, changeHash: false });
}) 
</script>
</html>

Answer 3

您无法通过PhoneGap应用程序连接到IP地址，因为这些地址不能列入白名单，您只能向配置中列入白名单的域发出CORS请求：http://docs.phonegap.com/en/1.9.0/guide_whitelist_index.md.html

phonegap应用程序中的getJSON无法正常工作

3 个答案: