使用jquery mobile修复url
我正在使用jquery mobile来构建一个站点但是当我点击一个按钮并且该按钮指向一个对话框页面时,在URL中出现#&ui-state=dialog
。 如果我输入没有
#&ui-state=dialog
的url是正确的,但是对话框窗口没有正确显示,因为显然ajax是禁用的。有一些方法可以修理它?
打开对话框时,使用$.mobile.changePage()
并将changeHash
选项设置为false
: http : //jquerymobile.com/demos/1.0.1/docs/api/methods.html
//delegate the event binding so elements in the DOM now and in the future will be bound-to $(document).delegate('#my-dialog-button', 'click', function () { //change to the dialog, forcing the hash to remain the same and the page to be viewed as a dialog $.mobile.changePage($('#my-dialog'), { changeHash : false, role : 'dialog' }); });
尝试在popup div标签中使用data-history =“false”,如:
祝好运! 🙂
不知道为什么,但是当我尝试集成它时,Jasper示例不起作用。
我在按钮上使用data-*
属性来配置对话框。
现在我声明changePage
函数中的所有选项,它工作正常。
$("#my-dialog-button").click(function() { $.mobile.changePage( "page_containing_the_dialog.html", { type: "get", transition: 'pop', role: 'dialog', changeHash : false }); });
使用changeHash
会禁用历史记录的更改,因为url不会更改。 因此,如果用户单击/点击关闭按钮,它将传播到上一页(如果有)。
此外,当用户点击移动设备上的后退按钮时,它可能会导致问题,因为弹出窗口打开时没有历史记录更改,它会再次将用户带回上一页而不是关闭弹出窗口,这将是不正确的行为。
如果我们使用transition
,而不是changeHash
,它将像对话框一样工作,让哈希也改变历史记录。
@Vincentp您是否尝试从’changePage’调用中删除changeHash
属性,现在您正在使用transition
?
$("#my-dialog-button").click(function () { var default_transition = "pop"; $.mobile.changePage("page_containing_the_dialog.html", { role : 'dialog', transition: $(this).data('transition') || default_transition }); return false; });