使用jQuery Mobile在页面之间传递数据？

Question

所以我刚开始学习jQuery Mobile,我已经学会了如何通过ajax加载所有链接而不实际加载下一页.我的几个页面使用表单和GET将数据传递到下一页 - 如何在使用jQuery Mobile时执行此操作？

Answer 1

我认为关于JQM很酷的一件事是你不必使用参数在页面之间传递数据.由于您与第一页在同一个DOM中,因此您可以使用普通旧变量访问数据,即

field1 = $('[name=field1]').val();
field2 = $('[name=field2]').val();

只要您使用JQM的ajax功能,就可以在下一页中执行以下操作:

$('.title').text(field1);

我为你做了一个jsfiddle例子.

其他方法是使用localStorage或sessionStorage api,或者文档中也提到了一些插件.

1. 页面参数
2. JQM路由器插件

Answer 2

通常,有两种方法可以在jQuery Mobile页面之间传递参数.

1. 在第一页修改Ajax地址,并在下一页中解析ajax以获取参数.
2. 使用HTML5 sessionStorage,一种WebStorage来传递参数.

这是使用ajax地址传输参数的方法. 如何在Jquery Mobile中的两个页面之间传递和获取参数？

使用sessionStorage/localStorage传输参数,您可以在第一页添加此代码,

<a href="#page_Parameter1" onclick="sessionStorage.ParameterID=123">
    Before go to next page, parameter id is storaged into sessionStorage.
</a>

在下一页中,您可以使用此方法获取参数内容,

$('#page_Parameter1').live('pageshow', function(event, ui) {
    alert('Parameter ID: ' + sessionStorage.ParameterID);
});