使用 jQuery Mobile 更改页面
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6255534/
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
Changing pages with jQuery Mobile
提问by Leonardo Marques
I'm using jQuery Mobile to make an academic work. I am using a anchor with an event onclick and no href attribute to change from one page to another. This works without a problem but after loading a page it displays Error Loading Page pop up.
我正在使用 jQuery Mobile 进行学术工作。我正在使用一个带有 onclick 事件的锚点，没有 href 属性来从一个页面更改为另一个页面。这没有问题，但在加载页面后，它会显示错误加载页面弹出窗口。
This is an example of this behavior:
这是此行为的示例：
testes.js:
睾丸.js：
function createAndChange(){
var lol="<div data-role='page' id='pg2'><div data-role='header' data-backbtn='true'>XPTO</div><h1>LOL</h1></div>";
$("body").append(lol);
$("#pg2").bind("callback", function(e, args) {
alert(args.mydata);
});
$.mobile.changePage($("#pg2"),"slide");
$.mobile.updateHash('#pg2',true);
$(page).trigger("callback", args);
}
index.html:
索引.html：
<html>
<head>
<title>title</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="testes.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">header</div>
<div data-role="content">
<a onclick="createAndChange()">content</a>
</div>
<div data-role="footer">footer</div>
</div>
</body>
</html>
Thank you for your attention.
感谢您的关注。
回答by Terrance
Your call to $.mobile.changePage($("#pg2"),"slide");isn't working properly.
Try explicitly declare all the parameters like this: $.mobile.changePage( $("#pg2"), "slide", true, true);
I didn't check the bugs list but apparently its a bug. For more info on this check the forum.
As for the error, its is there because the page doesn't know what argsis in this line.$(page).trigger("callback", args);
But this is pretty much the code I came out of your problem with....
您的呼叫$.mobile.changePage($("#pg2"),"slide");工作不正常。
尝试像这样明确声明所有参数：$.mobile.changePage( $("#pg2"), "slide", true, true);
我没有检查错误列表，但显然它是一个错误。有关此检查的更多信息，请访问论坛。
至于错误，它就在那里，因为页面不知道args这一行是什么。$(page).trigger("callback", args);
但这几乎是我从你的问题中得出的代码......
<html>
<head>
<title>title</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
<!--<script type="text/javascript" src="testes.js"></script>-->
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>
<script type="text/javascript">
function createAndChange(){
/*
var lol="<div data-role='page' id='pg2'>"+
" <div data-role='header' data-backbtn='true'>XPTO</div>"+
" <h1>LOL</h1>"+
"</div>";
$("body").append(lol);
*/
$("#pg2").bind("callback", function(e, args) {
alert(args.mydata);
});
//$.mobile.updateHash('#pg2',true);
//$.mobile.changePage($("#pg2"),"slide");
$.mobile.changePage( $("#pg2"), "slide", true, true);
$("page").trigger("callback");
}
</script>
</head>
<body>
<div data-role="page" id="frontpage">
<div data-role="header">header</div>
<div data-role="content">
<a onclick="createAndChange()">content</a>
</div>
<div data-role="footer">footer</div>
</div>
<div data-role="page" id="pg2">
<div data-role='header' data-backbtn='true'>XPTO</div>
<div data-role="content">
<h1>LOL</h1>
</div>
<div data-role="footer">footer</div>
</div>
</body>
</html>
