1

私は Telerik Icenium を使用してモバイル アプリを作成しています。Cordova と Jquery モバイルだけが関係しています。

フロントページには、このようなlistViewがあります

<ul data-role="listview">
                <li><a href="#OpenProject?pid=1" data-transition="slide">Project 1</a></li>
                <li><a href="#OpenProject?pid=2" data-transition="slide">Project 2</a></li>
            </ul>

これは代わりにローカル ストレージからロードしたいと考えており、ユーザーが選択したときに、それを API と同期します。

localstorage を使用してそこからアイテムを取得するのは良い方法でしょうか? もしそうなら、ローカルjsonファイルまたはモバイルのローカルデータベースからlistViewにアイテムをロードする良い方法を誰か教えてください。

ありがとう

4

1 に答える 1

1

私はあなたに実用的な例を作りました: http://jsfiddle.net/Gajotres/W3YDd/

$(document).on('pagebeforeshow', '#index', function(){       
        if(typeof(Storage)!=="undefined") {
            localStorage.jsonExample='[{"score":null,"popularity":3,"translated":true,"adult":false,"language":"en","original_name":"The Goonies","name":"The Goonies","alternative_name":"Балбесы","movie_type":"movie","id":9340,"imdb_id":"tt0089218","url":"http://www.themoviedb.org/movie/9340","votes":43,"rating":8.5,"certification":"PG","overview":"A young teenager named Mikey Walsh finds an old treasure map in his fathers attic. Hoping to save their homes from demolition, Mikey and his friends Data Wang, Chunk Cohen, and Mouth Devereaux run off on a big quest to find the secret stash of Pirate One-Eyed Willie.","released":"1985-06-06","posters":[{"image":{"type":"poster","size":"thumb","height":138,"width":92,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/w92/bZUbpjwnarSHJK40W9sGpyedWhx.jpg","id":"4ea6009334f8633bdc002f61"}},{"image":{"type":"poster","size":"w154","height":231,"width":154,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/w154/bZUbpjwnarSHJK40W9sGpyedWhx.jpg","id":"4ea6009334f8633bdc002f61"}},{"image":{"type":"poster","size":"cover","height":278,"width":185,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/w185/bZUbpjwnarSHJK40W9sGpyedWhx.jpg","id":"4ea6009334f8633bdc002f61"}},{"image":{"type":"poster","size":"w342","height":513,"width":342,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/w342/bZUbpjwnarSHJK40W9sGpyedWhx.jpg","id":"4ea6009334f8633bdc002f61"}},{"image":{"type":"poster","size":"mid","height":750,"width":500,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/w500/bZUbpjwnarSHJK40W9sGpyedWhx.jpg","id":"4ea6009334f8633bdc002f61"}},{"image":{"type":"poster","size":"original","height":1500,"width":1000,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/original/bZUbpjwnarSHJK40W9sGpyedWhx.jpg","id":"4ea6009334f8633bdc002f61"}}],"backdrops":[{"image":{"type":"backdrop","size":"thumb","height":169,"width":300,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/w300/awhHFqiw6Dta0uHQVjgwQiyOgro.jpg","id":"4ffdbd7f760ee3570d0000e8"}},{"image":{"type":"backdrop","size":"poster","height":439,"width":780,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/w780/awhHFqiw6Dta0uHQVjgwQiyOgro.jpg","id":"4ffdbd7f760ee3570d0000e8"}},{"image":{"type":"backdrop","size":"w1280","height":720,"width":1280,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/w1280/awhHFqiw6Dta0uHQVjgwQiyOgro.jpg","id":"4ffdbd7f760ee3570d0000e8"}},{"image":{"type":"backdrop","size":"original","height":1080,"width":1920,"url":"http://d3gtl9l2a4fn1j.cloudfront.net/t/p/original/awhHFqiw6Dta0uHQVjgwQiyOgro.jpg","id":"4ffdbd7f760ee3570d0000e8"}}],"version":3350,"last_modified_at":"2013-03-19 13:57:18 UTC"}]';      
        }

    var jsonObject = jQuery.parseJSON(localStorage.jsonExample);

    $('#movie-data').append('<li>Movie name:<span> ' + jsonObject[0].original_name+ '</span></li>');
    $('#movie-data').append('<li>Popularity:<span> ' + jsonObject[0].popularity + '</span></li>');
    $('#movie-data').append('<li>Rating:<span> ' + jsonObject[0].rating+ '</span></li>');
    $('#movie-data').append('<li>Overview:<span> ' + jsonObject[0].overview+ '</span></li>');
    $('#movie-data').append('<li>Released:<span> ' + jsonObject[0].released+ '</span></li>');  
    $('#movie-data').listview('refresh'); 
});

より明確にするために、この例は他の例から作成されました。

http://jsfiddle.net/Gajotres/jLdFj/

この例では、json はリモート ソースから取得されます。しかし、基本原理は同じです。

于 2013-03-23T10:10:41.330 に答える