个人中心
gpt4 book ai didi

javascript - 更改页面时 Intel XDK jQuery Mobile 错误

转载 作者：行者123 更新时间：2023-11-28 19:54:32 24 4
gpt4 key购买 nike

我刚刚开始使用英特尔 XDK 中的一个简单的 jQuery Mobile 应用程序。只有两个页面( View )和一个用于显示主页面第二页的按钮。

下面是未修改的代码(由视觉设计师生成)。

<!DOCTYPE html>
<!--HTML5 doctype-->
<html>
    <head>
    <link rel="stylesheet" type="text/css" href="jqm/jquery.mobile-min.css">
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="css/index_main.less.css" class="main-less">
    <title>Your New Application</title>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
    <style type="text/css">
        /* Prevent copy paste for all elements except text fields */
        *  { -webkit-user-select:none; -webkit-tap-highlight-color:rgba(255, 255, 255, 0); }
        input, textarea  { -webkit-user-select:text; }
    </style>
    <script src="intelxdk.js"></script>
    <script type="text/javascript">
        /* This code is used to run as soon as Intel activates */
        var onDeviceReady=function(){
        //hide splash screen
        intel.xdk.device.hideSplashScreen();
        };
    document.addEventListener("intel.xdk.device.ready",onDeviceReady,false);
    </script>
    <script type="application/javascript" src="js/jquery.min.js"></script>
    <script type="application/javascript" src="jqm/jquery.mobile-min.js" data-ver="0"></script>
    <script type="application/javascript" src="js/index_user_scripts.js"></script>
</head>
<body>
    <!-- content goes here-->
    <div class="uwrap">
        <div class="upage" id="mainpage" data-role="page">
            <div class="upage-outer">
                <div class="upage-content" id="mainsub">
                    <div class="grid grid-pad urow uib_row_1 row-height-1" data-uib="layout/row" data-ver="0">
                        <div class="col uib_col_1 col-0_12-12" data-uib="layout/col" data-ver="0">
                            <div class="widget-container content-area vertical-col">
                                <div class="widget uib_w_1 d-margins" data-uib="media/text" data-ver="0" id="page1-line1">
                                    <div class="widget-container left-receptacle"></div>
                                    <div class="widget-container right-receptacle"></div>
                                    <div>
                                    <p>Text in page-1</p>
                                    </div>
                                </div><a class="widget uib_w_3 d-margins" data-uib="jquery_mobile/button" data-ver="0" data-role="button" id="gotoP2">goto Page2</a><span class="uib_shim"></span>
                            </div>
                        </div>
                        <span class="uib_shim"></span>
                    </div>
                </div>
                <!-- /upage-content -->
            </div>
            <!-- /upage-outer -->
        </div>
        <div class="upage" id="secondPage" data-role="page">
            <div class="upage-outer">
                <div id="secondPagesub" class="upage-content ">
                    <div class="grid grid-pad urow uib_row_2 row-height-2" data-uib="layout/row" data-ver="0">
                        <div class="col uib_col_2 col-0_12-12" data-uib="layout/col" data-ver="0">
                            <div class="widget-container content-area vertical-col">
                                <div class="widget uib_w_2 d-margins" data-uib="media/text" data-ver="0" id="page2-line1">
                                    <div class="widget-container left-receptacle"></div>
                                    <div class="widget-container right-receptacle"></div>
                                    <div>
                                        <p>Text in page 2</p>
                                    </div>
                                </div><span class="uib_shim"></span>
                            </div>
                        </div>
                        <span class="uib_shim"></span>
                    </div>
                </div>
            </div>
            <!-- /upage-outer -->
        </div>
        <!-- /upage -->
    </div>
    <!-- /uwrap -->
</body>

以及index_user_scfripts.js 文件:

(function()  {
 "use strict";
  function register_event_handlers()   {
        $("#gotoP2").click(function(evt)  {
        $("body").pagecontainer("change", "secondPage", { reverse: false});
        });
}
 $(document).ready(register_event_handlers);
})();

当我点击第一页中的按钮时，调试器在 jquery.min.js 文件中抛出 JavaScript 错误:

未捕获错误:无法在初始化之前调用 pagecontainer 的方法；尝试调用方法“change”

欢迎任何建议。

最佳答案

问题出在调用页面更改的方法上。相反，index_user_scripts.js 必须是:

(function() {
   "use strict";
   function register_event_handlers()  {
       $("#gotoP2").click(function(evt)  {
           $(":mobile-pagecontainer").pagecontainer("change", "#secondPage", { reverse: false});
       });
   }
   $(document).ready(register_event_handlers);
})();

关于javascript - 更改页面时 Intel XDK jQuery Mobile 错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22819175/

24 4 0
文章推荐： .net - Visual Studio 和 .NET 中的测试条件
文章推荐： javascript - 正则表达式 url 段上的正向 Lookbehind
文章推荐： ios - UITableView 滚动时重置 ContentOffset
文章推荐： javascript - 单击后返回文本框
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com