我在这个问题上被困了几天。
为简化起见,我有2页(<div data-role="page" id="page1">...</div>
和<div data-role="page" id="page2">...</div>)
以及执行changePage("#page2")
的JS脚本;
因此,URL被正确修改,但我们看到的页面仍然是第一个。当我按F5时,它会刷新到第二页。
我真的不明白为什么会这样做,任何帮助都将不胜感激!
这是我的简化代码:
<!DOCTYPE html>
<html>
<head>
$view->jQuery()->setLocalPath('/js/jquery-1.9.1.min.js');
$view->jQuery()->addJavascriptFile('/js/jquery.mobile-1.3.1.js');
</head>
<body>
<div class="tite"> Title</div>
<form ...>
<div class="zend_form">
<div data-role="page" id="page1">
<div data-role="header" data-backbtn="false"> ... </div>
<div class="title"> Another title </div>
<div data-role="content">
...
...
<a data-role="button" class="validPartial" href="#">Submit</a>
</div>
<div data-role="footer"> ... </div>
</div>
<div data-role="page" id="page2">
<div data-role="header" data-backbtn="false"> ... </div>
<div class="title"> Second page title </div>
<div data-role="content">
...
</div>
<div data-role="footer"> ... </div>
</div>
</div>
</form>
<p>
Some text added by JQuery
</p>
<script>
$(document).ready(function() {
$('.validPartial').tap(function(e){
$.mobile.changePage("#page2");
});
});
</script>
</body>
</html>