-1

我正在尝试为我的网站创建一个 phonegap 应用程序...但是我需要添加从网站接收数据并将其显示在我的应用程序上...

我已修改网站以显示 json 格式的信息，如下所示http://belladoni.co.nz/index.php?route=product/category&path=59&json

如何在应用程序中显示来自 json 的这些信息？我该如何回应它？我如何让它显示 json 中提到的图像？

请提供帮助，如果可能的话，请提供一个有效的jsfiddle.net

我的 json 如下所示：

"items": [{"product_id":"85","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Old Mill Road\/Flower Globe Green-164x264.jpg","name":"Antique Flower Globe","description":"Have beautifully arranged flower posies in your home all the time with this goregous glass flower gl..","price":"$22.89","special":false,"tax":"$19.90","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Antique-Flower-Globe"},{"product_id":"54","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Maytime\/FB Double Closed 1-164x264.jpeg","name":"Birds of Flight, Set of 3","description":"Beautifully graceful and delicate, these birds are fabulous and create an instant work of art w..","price":"$95.00","special":false,"tax":"$82.61","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Flying-Bird-#1"},{"product_id":"56","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Oneworld\/CHANDELIER COASTERS SET4 ES8021-164x264.jpg","name":"Chandelier Coasters Set of 4","description":"Beautiful set of 4 coasters featuring chandeliers, birds, butterflys and roses ... shabby chic at it..","price":"$29.90","special":false,"tax":"$26.00","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Chandelier-Coasters-Set-of-4"},{"product_id":"62","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Maytime\/Cushion; Circle Cotton Cinnamon-164x264.jpeg","name":"Cinnamon Circle Cushion","description":"Vibrant cotton circle cushion in a yummy cinnamon colour.\r\n\r\nPair with our Dandelion Cushion for a g..","price":"$59.90","special":false,"tax":"$52.09","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Cinnamon-Circle-Cushion"},{"product_id":"86","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Old Mill Road\/Angel-164x264.jpg","name":"Gorgeous Waiting Angel","description":"Oh so cute! \nA percentage of the proceeds generated from sales of our Waiting Angels will be do..","price":"$19.90","special":false,"tax":"$17.30","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Gorgeous-Waiting-Angel"},{"product_id":"102","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Seaco\/VintageCrownCandle003-164x264.png","name":"Vintage Crown Candle","description":"Gorgeous vintage candle bearing a royal crown.  These majestic candles command attention and th..","price":"$19.90","special":false,"tax":"$19.90","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Vintage-Crown-Candle"},{"product_id":"103","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Seaco\/VintageCrownCandle002-164x264.png","name":"Vintage Crown Candle","description":"Gorgeous vintage candle bearing a royal crown.  These majestic candles command attention and th..","price":"$19.90","special":false,"tax":"$19.90","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Vintage-Crown-Candle-1081"},{"product_id":"59","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Seaco\/VintageCrownCandle001-164x264.png","name":"Vintage Crown Candle","description":"Gorgeous vintage candle bearing a royal crown.  These majestic candles command attention and th..","price":"$19.90","special":false,"tax":"$19.90","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Vintage-Crown-Candle-Set-of-Four"},{"product_id":"57","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Seaco\/VintageParisCrownCushion-164x264.jpg","name":"Vintage Paris Cushion","description":"A beautiful Provincial cushion that will give a french touch to any decor.  Linen filled c..","price":"$52.17","special":false,"tax":"$52.17","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Vintage-Paris-Cushion"},{"product_id":"58","thumb":"http:\/\/belladoni.co.nz\/image\/cache\/data\/Seaco\/VintageParisCrownCushion70x35-164x264.jpg","name":"Vintage Paris Cushion Long","description":"A beautiful Provincial cushion that will give a french touch to any decor.  \n\nLinen filled..","price":"$50.00","special":false,"tax":"$43.48","rating":0,"reviews":"Based on 0 reviews.","href":"http:\/\/belladoni.co.nz\/decor\/Vintage-Paris-Cushion-Long"}]
4

2 回答 2

1

请参阅我的 jsfiddle http://jsfiddle.net/3SakE/4/

您的 JSON 看起来已损坏，因此无法正常工作，但您应该能够理解。

$.getJSON('http://belladoni.co.nz/index.php?route=product/category&path=59&json', function(data){

    $.each(data['items'], function(key, val){
        $('#results').append("<p>"+key+"</br>"+val+"</p>"); 
    });

    //or iterate through each item in the object like so
    $('#results').text(data.items.price);

});
于 2013-10-16T20:05:25.190 回答
0

您可以使用 Mustache.js（模板库）。

或者您必须手动迭代每个 JSON 对象并构造 HTML 并附加到您的网站正文。

我的建议是通过 Mustache.js。

于 2013-10-16T20:01:03.200 回答