1

我想使用 jQuery Mobile 构建一个移动应用程序。

该应用程序应该有一个附有图像的饮料食谱列表（1500 件）。

存储食谱和图像的最佳方式是什么？

我在想，recipies 应该被结构化并存储在一个大的 XML 文件中，并且图像应该在一个文件夹中。

计划使用 PhoneGap 将应用程序作为本机发布。

该应用程序应该能够离线工作。

对我的问题有什么建议吗？

4

2 回答 2

1

如果可能，请尝试设置 Web 服务并使用例如。JSONP 技术尝试下载数据。存储在文件夹中不会让您更新您的内容，这对于添加新配方或更改现有配方可能很有用。图像可以存储在文件夹中，并在 ajax 成功时由 javascript 访问。

将已经下载的食谱存储在 SQLite 数据库中是个好主意。

于 2012-09-10T09:16:44.603 回答
1

为此，我正在使用BackboneJS 。我在这里推荐 Backbone，因为从一开始就使用它会让您更容易迁移到原生移动应用程序。

使用 Backbone，您可以定义一个模型：

window.RecipeModel = Backbone.Model.extend({});

然后定义一个食谱集合：

window.RecipeCollection = Backbone.Collection.extend({ model: RecipeModel });

最后，您可以发送您的食谱的 JSON 表示并用它初始化 RecipeCollection：

var recipesJSON = // Get JSON from server OR local HTML tag (explained below)
window.recipeCollection = new RecipeCollection(recipesJSON);

编辑：

您还可以将 JSON 存储在 HTML 中，而不是使用 HTML 中的以下标记从服务器获取它：

<script id="recipes_data" type="application/json">{[ {name: "recipe1", type: "some_recipe_type", image_url: "recipe1_image.png"}, {name: "recipe2", type: "some_other_recipe_type", image_url: "recipe2_image.png"}...]}</script>

然后你可以阅读它：

var data = JSON.parse($("#recipes_data").html());

至于图片位置：您可以将它们放在一个单独的文件夹中，并从您的 css 文件中相对引用它们。一旦你进入 phonegap，这些相对路径将被转换为本地文件，这样你的应用程序就可以离线工作。

于 2012-09-10T09:17:31.730 回答