我有一个包含两个主要页面(登录页面和地图页面)的应用程序,它们生成用作对话框的动态页面,其中大多数都有子页面,在链式对话框结构中。
所以一个完全正常的做法是:
登录 -> 地图 -> 对话框 -> 子对话框
最初,我使用界面上的一个按钮从 Map 移动到 Dialog,如下所示:
<a href="#dialogID" data-icon="arrow-r" data-iconpos="right" data-rel="dialog" data-role="button" data-theme="b" class="ui-btn-right">Info</a>
使用该系统,我可以使用对话框上的关闭按钮或浏览器上的后退按钮完美地从 Login 导航到 Sub-Dialog 并再次返回。地址栏更新如下:
Login Page: http://serverName/
Maps Page: http://serverName/#page-map
Dialog: http://serverName/#page-map&ui-state=dialog
Sub-Dialog: http://serverName/#page-map&ui-state=dialog&ui-state=dialog
这是完全正常的行为,只要我点击带有 data-rel="dialog" 的链接,它就可以正常工作。
但我想改变我网站的行为,这样当你点击一个谷歌地图标记对象时,它会直接打开对话框。我用以下方法做到这一点:
$.mobile.changePage($("#dialogID"), { role: "dialog" });
当我这样做时,导航返回或点击子对话框上的关闭按钮会让我回到查看登录页面。但是,URL 是 Dialog 状态的 URL。所以 URL 是正确的,但我在屏幕上看到的内容是错误的。
因此,我现在不是通常能够进入 ABCD->DCBA,而是进入 ABCD->DA 并跳过中间的这两页。
这是 jQueryMobile 中的错误吗?还是我使用 changePage 错误?
编辑:这是一个展示行为的深入 JSFiddle:http://jsfiddle.net/LxFJq/14/ 它似乎是由于动态页面而出现的。当它们是静态页面(http://jsfiddle.net/hgb7s/2/)时,一切都按预期工作。动态页面会破坏导航,但仅在从事件处理程序单击的边缘情况下。至少我已经缩小了范围。
已解决:我自己解决了这个问题。
<a data-rel="dialog"> 标记会自动将 data-url 属性添加到新页面。changePage() 函数不会。所以我自己添加了它们,一切正常。工作结果,数据相关属性位于http://jsfiddle.net/LxFJq/15/
根据前两条评论找到此信息:https ://gist.github.com/1037934