5

サービスからのアイテムを表示するアプリケーションがあります。ここでは、約 200 の項目を表示していますが、これは見にくいものです。

ここでは、最初の 20 を表示してさらに読み込み機能を表示し、さらに読み込みをクリックすると次の 20 などを表示したいと考えています。誰かが私を助けてくれれば、これを実装する方法を見つけることができません。

4

2 に答える 2

1

200 個のアイテムを読み込んで保存するのは、phonegap/cordova では適切な方法ではありません。すでに遅い HTML5 + JS ラッパーについて話していますが、これによりさらに遅くなります。

より良いアプローチは、ajax を使用してより多くのデータをロードすることです。リストビューの最後に到達したとき、または「新しいコンテンツをロードする」ボタンがクリックされたときに、ajax 呼び出しがトリガーされます。

ここでは、「新しいコンテンツを読み込む」ボタンを使用したアプローチを見つけることができます:

http://jsfiddle.net/knuTW/2/

ここでは、リストビューの終わりに達したときにリストビューを自動ロードするアプローチを見つけることができます:

http://jsfiddle.net/dhavaln/nVLZA/

この例では、次の jQuery プラグインが必要です: http://imakewebthings.com/jquery-waypoints/

そして、リストビューと $.ajax を組み合わせて自動ロードする私の例を次に示します。

http://jsfiddle.net/Gajotres/v4NxB/

コード例、繰り返しますが、これは単なるダミーの例です (まだダミーの例が動作しています):

// load test data initially
for (i=0; i < 10; i++) {
    $("#list").append($("<li><a href=\"index.html\"><h3>" + i + "</h3><p>z</p></a></li>"));
}
$("#list").listview('refresh');


// load new data when reached at bottom
$('#footer').waypoint(function(a, b) {
    // Load some dynamic data with $.ajax
   $.ajax({url: "http://api.themoviedb.org/2.1/Movie.search/en/json/23afca60ebf72f8d88cdcae2c4f31866/The Goonies",
        dataType: "jsonp",
        jsonpCallback: 'successCallback',
        async: true,
        beforeSend: function() {
            $.mobile.showPageLoadingMsg(true);
        },
        complete: function() {
            $.mobile.hidePageLoadingMsg();
        },
        success: function (result) {
            ajax.parseJSONP(result);
        },
        error: function (request,error) {
            //alert('Network error has occurred please try again!');
        }
    });    
    $('#footer').waypoint({
        offset: '100%'
    });
}, {
    offset: '100%'
});

var ajax = {  
    parseJSONP:function(result){
        //var jsonObj = jQuery.parseJSON(parameters);
        $("#list").append('<li>Movie name:<span> ' + result[0].original_name+ '</span></li>');
        $("#list").append('<li>Popularity:<span> ' + result[0].popularity + '</span></li>');
        $("#list").append('<li>Rating:<span> ' + result[0].rating+ '</span></li>');
        $("#list").append('<li>Overview:<span> ' + result[0].overview+ '</span></li>');
        $("#list").append('<li>Released:<span> ' + result[0].released+ '</span></li>');        
        $("#list").listview('refresh');
    }
}

また、最後の $.ajax 呼び出しが終了する前に、別の $.ajax 呼び出しを防ぐ必要があります。

于 2012-12-26T13:07:20.300 に答える
0

Phonegap と Shared Preferences についてはあまり詳しくありませんが、調査の結果、phonegap で共有設定を直接使用する方法がないことがわかりました (検索できる限り)。

  • Phonegap で共有設定を引き続き使用する場合は、プラグインを追加する必要があります。
  • 私が見つけることができる他の方法は、HTML5 と JSON を使用して Local Storage を使用することです。
  • もう 1 つの方法は、Lawnchair を使用してデータベースを実装することです。あなたはこことここで良い解決策を見つけるでしょう
  • これまでに見つけた最も効率的な方法の 1 つはWebkit Client side Databse Storageです。それはどういうわけかあなたの問題にぴったりです。
于 2012-12-26T06:38:40.297 に答える