1

我使用 Telerik Icenium 创建一个移动应用程序，它只涉及 Cordova 和 Jquery mobile。

在首页我有一个这样的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 同步。

这是使用本地存储并从那里获取项目的好方法吗？如果是这样，任何人都可以给我一个很好的方法来将项目从本地 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 回答