jquery - 使用 jQuery Mobile 更改页面

标签 jquery html jquery-mobile

我正在使用 jQuery Mobile 来完成一项学术工作。我正在使用带有事件 onclick 且没有 href 属性的 anchor 从一个页面更改为另一个页面。这没有问题,但在加载页面后显示错误加载页面弹出窗口。

这是这种行为的一个例子:

testes.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>
    <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>


感谢您的关注。

最佳答案

您调用$.mobile.changePage($("#pg2"),"slide");不能正常工作。

尝试像这样显式声明所有参数:

$.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.

至于错误,它在那里是因为页面不知道什么 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>



关于jquery - 使用 jQuery Mobile 更改页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6255534/

相关文章:

jquery - POST 未更改的有效负载

javascript - 隐藏 'Dropdown' 选择

jquery - 在网页中创建由鼠标滚轮驱动的 "zoom in"和 "zoom out"

jquery - 视频事件 HTML5 jQuery

jQuery 移动 : new content on internal page transition

Jquery: append 表单输入值 (.val)

javascript - HTML 页面永远不会停止加载

javascript - 警告框需要多次关闭

html - 如何强制 netbeans html 自动完成使用双引号而不是单引号?

javascript - 无法清除基于 Jquery Mobile 的应用程序中的 Dom