使用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);

我为你做了a jsfiddle example。

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

1. page params
2. JQM router plugin

Answer 2

通常，jQuery Mobile页面之间有2个传递参数的方法。

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

---

这是使用ajax地址传输参数的方法。 How to pass and get Parameters between two Pages in 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);
});