jQuery Mobile,AJAX和模态对话框:howto?

时间:2012-07-05 11:07:57

标签: jquery ajax jquery-mobile

以下是我想要做的事情:包含以下内容的唯一 HTML页面:

  • 很多<ul><li></li></ul>显示菜单然后是子菜单然后子菜单,选择产品
  • 要求提供固定数量产品的对话框(1,2和5)
  • 处理AJAX的JavaScript

以下是这将如何运作:客户“浏览”所有类别和产品,如果他想要一个,我会显示一个带有产品说明的对话框,询问他有多少产品( 125)。

(1)当客​​户点击125时,我向服务器发出“AJAX请求”“将此产品添加到购物篮”(=保留所有内容)在服务器端)。注意:它是所有JSON

(2)当客户点击购物篮时,我会转到一个新页面,显示购物篮中的内容以及验证它的选项。

两个问题:

  • 没有使用jQuery mobile“动态更改”模态对话框的示例。它是否与jQuery具有相同的原则(即我只需修改一下我的脚本以使其在手机上运行)?
  • 没有以JSON 格式交换的AJAX样本(这些都是关于加载完整的HTML网页,而不仅仅是纯数据交换)。同样的问题:这与jQuery的原理相同吗?

1 个答案:

答案 0 :(得分:0)

  

没有使用jQuery“动态更改”模态对话框的示例   移动。它与jQuery具有相同的原则(即我必须这样做   修改我的脚本以使其在手机上工作)

我不相信jQuery本身也有对话,相反我认为你指的是jQuery UI dialog。也就是说原理基本相同,只需更改两次使用之间的内容,就可以重复使用相同的对话框来显示不同的内容。您可能需要注意的主要事情是,对于由jquery mobile增强的内容,您可能需要调用相应的小部件刷新或创建方法。此外,虽然我不确定它是否已正式记录,但您经常需要在pageshow(或至少在页面显示之前)event进行此操作。

例如,假设您要更改JQM listeview中的项目,可能需要执行以下操作才能使新内容得到增强

$(document).delegate('#yourDialog','pageshow', function(page,ui) {
   $('#yourListView').listview('refresh');
})
  

没有JSON格式的AJAX交换样本(这都是关于   加载完整的HTML网页,不仅仅是纯数据交换)。相同   问:这与jQuery的原理相同吗?

没有样本,因为它的工作方式完全相同,JQM需要一个版本的jQuery库,所以那些函数都还在那里(当然你实际上并不需要jQuery来执行ajax调用)。您可以定期执行ajax请求,并按照您的意愿进行响应。