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