我正在使用Dreamweaver CS6(带有PhoneGap)、jQuery Mobile和JavaScript开发一个移动应用程序，该应用程序将收集用户输入的表单数据，将数据转换为JSON对象并将其传输到python web服务。该移动应用程序的目的是让用户创建一份食物订单，然后发送到餐厅。我想向SO社区询问，什么是处理创建订单逻辑的优雅方式。目前，逻辑是由HTML页面中的JavaScript定义的，示例如下(为简洁起见，截断)：
JavaScript:
var burgerType; //defines burger type eg.cheeseburger,hamburger
var burgerQueue = new Array(); //holds completed burgers
//detects if cheeseburger
$("#cheeseburger").click(function() {
burgerType="cheeseburger";
});
//detects if hamburger
$("#hamburger").click(function() {
burgerType="hamburger";
});
HTML:
<div data-role="content">
<ul data-role="listview" data-theme="e" id="burgers">
<li id="cheeseburger"><a href="#toppings">Cheeseburger</a></li>
<li id="hamburger"><a href="#toppings">Hamburger</a></li>
</ul>
</div>
屏幕截图：点击汉堡会进入一个屏幕，让你选择浇头，但没有包括它，因为你认为它不相关。
我意识到这可能是一种非常糟糕的逻辑处理方式，因为如果餐厅菜单发生变化，我将不得不修改应用程序，将其重新发布到各自的市场(Play、iTunes等)，并让用户进行更新。我最不想做的事就是因为错误或更改而不得不不断更新应用程序，从而让用户感到沮丧。我知道我可以通过使用驻留在应用程序目录中的外部javascript库将逻辑从HTML中部分分离出来，但这对不断更新问题没有帮助。我本可以将应用程序链接到网络服务器上的移动应用程序页面(这样我所做的更改就可以在不更新应用程序的情况下立即看到)，但我在另一篇so帖子中看到，苹果的看门人不会发布基本上只是应用程序中的网页的应用程序。我正在查看django web框架，并认为它可能是我想要的，但不确定这就是为什么我要向SO的编码大师询问，以获得我应该做什么的想法。
概括一下：尝试使用jQuery/JavaScript动态生成用户界面和编码逻辑，而不会因为不断的更新而让用户感到沮丧。(有点像jQuery让你热链接到他们的CDN托管库)。我意识到这可能会让人困惑，我会澄清任何问题。
您可以将单个事件绑定到多个元素：
$("#burgers").on("click", "a" function() {
var li = $(this).parent();
burgerType = li.attr("id");
$.mobile.changePage("#toppings");
return false;
});
然后，您只需要根据数据生成列表元素，可能是基于ajax调用。对于这类事情，我通常在应用程序启动时在后台进行ajax调用，并保存该调用的先前结果，这样连接更新就不会减慢应用程序的启动速度。
对于这种事情，您最好使用像jQuery mobile这样的AJAX导航框架，它可以在不重新加载任何内容的情况下从一页移动到另一页，而您只有一个真正的html文档。