JQuery Mobile:changePage更改URL但不刷新页面

时间:2013-06-07 14:33:52

标签: jquery-mobile

我在这个问题上被困了几天。 为简化起见,我有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>

0 个答案:

没有答案