jQuery 移动更改页面
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9738948/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Jquery mobile change page
提问by siva
I have two column layout for a webpage from the site, http://jquerymobile.com/demos/1.0.1/
我有来自网站的网页的两列布局， http://jquerymobile.com/demos/1.0.1/
Now they have provided provisions to changePage using
<a href="#xxx" data-role="button">Sample</a>
现在他们提供了使用 changePage 的规定
<a href="#xxx" data-role="button">Sample</a>
But my question is how to programmatically change page using code.
但我的问题是如何使用代码以编程方式更改页面。
$.mobile.changePage("#xxx");isn't working for me
$.mobile.changePage("#xxx");不适合我
回答by shanabus
Here is a real simple example for you: http://jsfiddle.net/shanabus/YjsPD/
这是一个非常简单的例子：http: //jsfiddle.net/shanabus/YjsPD/
$.mobile.changePage("#page2");
Documentation: http://api.jquerymobile.com/jQuery.mobile.changePage/
文档：http: //api.jquerymobile.com/jQuery.mobile.changePage/
Other examples:
其他例子：
//transition to the "about us" page with a slideup transition
$.mobile.changePage( "about/us.html", { transition: "slideup"} );
//transition to the "search results" page, using data from a form with an ID of "search""
$.mobile.changePage( "searchresults.php", {
type: "post",
data: $("form#search").serialize()
});
//transition to the "confirm" page with a "pop" transition without tracking it in history
$.mobile.changePage( "../alerts/confirm.html", {
transition: "pop",
reverse: false,
changeHash: false
});
UPDATE
更新
As Chase Roberts points out in the comments below, this changePagemethod was deprecated in version 1.4. Here is the documentation for the new pagecontainer changeevent.
正如 Chase Roberts 在下面的评论中指出的那样，此changePage方法在 1.4 版中已被弃用。这是新页面容器更改事件的文档。
Example:
例子：
$.mobile.pageContainer.pagecontainer("change", "#page", { options });
This was also addressed on this SO question: How to change page in jQuery mobile (1.4 beta)?
这个问题也解决了这个问题：How to change page in jQuery mobile (1.4 beta)?
回答by Polecat Harris
I know this has already been answered but surely the correct answer why it wasn't working is that the syntax is incorrect ?
我知道这已经得到了回答，但为什么它不起作用的正确答案肯定是语法不正确？
$.mobile.changePage requires the DOM object (for displaying pages within the same HTML file using the hash syntax) and not just a string. So the correct syntax for the example given would be:
$.mobile.changePage 需要 DOM 对象（用于使用哈希语法在同一 HTML 文件中显示页面）而不仅仅是字符串。因此，给出的示例的正确语法是：
$.mobile.changePage($("#xxx"));
That should work a treat !
那应该是一种享受！
Hope this helps
希望这可以帮助
回答by mmcconkie
$.mobile.changePage($("#page2"));
is the correct way to change between which div is the visible page.
是在哪个 div 是可见页面之间进行更改的正确方法。
If you use
如果你使用
$.mobile.changePage("#page2");
The DOM will be reloaded, and any ondocumentready events will be triggered.
DOM 将被重新加载，并且任何 ondocumentready 事件都将被触发。
回答by Hemant Dubey
You first check the div block start and end tag bcoz sometime if some tag is missing the page transition is not possible. After that use the following code
如果某些标签丢失，页面转换是不可能的，你首先检查 div 块的开始和结束标签 bcoz。之后使用以下代码
$.mobile.changePage("#page2");
回答by Scorpy86
No, this is the correct syntax $.mobile.changePage("#page2");or $.mobile.changePage( "about/us.html");see the Api
不，这是正确的语法$.mobile.changePage("#page2");或$.mobile.changePage( "about/us.html");查看 Api
回答by Rajat_R
function signin() {
alert('singin button has been clicked');
$.ajax({
type: 'POST',
url: 'http://localhost:8080/json/login',
dataType: "json",
headers: {'Authorization':'Basic '+ btoa('abc' + ':' + '12345')},
contentType: 'application/json',
data:loginFormToJSON(),
success: function(data, textStatus, jqXHR)
{
if(data.token !="ErrorID-11000"){
alert('login successfully');
//document.location.href = "accountinfo.html";
//document.getElementById("loginBtn").replace="accountinfo.html";
$.mobile.changePage("accountinfo.html");
}
else{
alert('userid password did not match');
}
},
error: function(jqXHR, textStatus, errorThrown){
alert('login error:'+errorThrown + textStatus);
}
});
}
From the above code, I am in sign in page and going to accounts page on successful login, this is working with Jquery mobile 1.4.
从上面的代码中，我在登录页面并在成功登录后转到帐户页面，这适用于 Jquery mobile 1.4。
Hope that helps.
希望有帮助。
