0

ヘルプ、次のコードのように div タグにデータが表示されているときにループを実行したい:

function GetDataFromServer() {

var url = "http://bertho.web.id/curl/services21/DataReadNP.php";
JSONP.get(url, {}, function(response){
    var listItem, container, dataList = document.getElementById("dataList"), str = "", str2 = "";
            for ( var i = 0; i < response.length; ++i ) {
                str += response[i].title;
                str2 += response[i].fetch_date;
            }

    listItem = document.createElement('div');
    listItem.setAttribute('data-bb-type', 'item');
    listItem.setAttribute('data-bb-img', 'images/icons/icon11.png');
    listItem.setAttribute('data-bb-title', str);
    listItem.innerHTML = str2;

    container = document.createElement('div');
    container.appendChild(listItem);

    bb.imageList.apply([container]);

    dataList.appendChild(container.firstChild);

    if (bb.scroller) {
        bb.scroller.refresh();
    }

});  

}

リストを画面に表示するには:

function dataOnTheFly() {
   document.getElementById('waiting').style.display = 'none';
   GetDataFromServer()  
}

必要なデータが画面に表示されますが、必要なデータと一致しません。下の写真をご覧ください:

http://s13.postimage.org/68w2zfmh3/data_BB.png

サーバー上のすべてのデータが取得されるまで、このデータのループをリストしたいと思います。希望する結果を得るにはどうすればよいですか?

4

1 に答える 1

1

質問で指定された URL を引き上げると、データは次のようになります。

"items": [
 {
  "id": "30",
  "judul": "KATY PERRY: PART OF ME",
  "img": "http:\/\/bertho.web.id\/curl\/21proses\/images\/r_134760931680781_100x147.jpg",
  "desk": "Sebuah dokumentasi tentang kehidupan Katy Perry diatas maupun diluar panggung. [More]",
  "web": "http:\/\/www.21cineplex.com\/",
  "fetch_date": "15-09-2012 20:10:23"
 },

これはJSON応答であり、a ではありませんJSONP。それらは似ていますが、異なります。あなたのJSONP機能が何をするかわからないので、どのように進めるか正確には言えません。

ある時点で、JSON.parse()受け取ったデータを実行する必要があります。ライブラリがこれを行う場合としない場合があります。もしそうならtypeof response === "string"、そうではありません。

JSONオブジェクトにデコードしたら、ループするだけです。

var items = response.items;
var l = items.length;
var i = 0;
var item;

for (i = 0; i < l; i++) {
  item = items[i];
  // Now you can do something with item
   listItem = document.createElement('div');
   listItem.setAttribute('data-bb-type', 'item');
   listItem.setAttribute('data-bb-img', item.img);
   listItem.setAttribute('data-bb-title', item.judul);
   // Don't forget to append listItem somewhere.
}
于 2012-09-15T17:30:24.570 に答える