Question

这是我的档案。

保留

/www/js/index.js。

页面流程应为：应用程序启动 - ＆gt; index.html - ＆gt;从indexB.js加载MainPage.html - ＆gt; MainPage.html 但是所有的css都没有加载。

当我从index.html中删除'body onload =“init（）;”'并将副本和过去的MainPage.html复制到index.html的主体上时，css没有问题。

由此，我检查了所有的css路线都是正确的。

/www/index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script type="text/javascript" charset="utf-8" src="jqmobile/jquery-1.11.2.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="cordova.js"></script>     
    <script type="text/javascript" charset="utf-8" src="jqmobile/jquery.mobile-1.4.5.min.js"></script>

    <link rel="stylesheet" href="jqmobile/jquery.mobile-1.4.5.min.css">
    <link rel="stylesheet" href="css/MainPage.css">

    <script src="js/index.js"></script>
    <script src="js/indexB.js"></script>
</head>
<body onload="init();">
<div data-role="page">

</div>
</body>
</html>

/www/js/indexB.js

var pagesHistory = [];
var currentPage = {};
var path = "";

function init(){
$("div[data-role='page']").load(path + "pages/MainPage.html", function(){
    $.getScript(path + "js/MainPage.js", function() {
        if (currentPage.init) {
            currentPage.init();
        }
    });
});
}

/www/pages/MainPage.html

<script>
$.getScript(path + "js/MainPage.js");
</script>

<div id="header-wrapper">
    <div data-role="navbar" id="navBar">
        <ul id='navBarUl'>
            <li>
                <a href="#" data-role="tab" data-icon="user" data-transition="none" class="fastClick">Friends</a>
            </li> 
            <li>
                <a href="#" data-role="tab" data-icon="clock" data-transition="slideup" class="fastClick ui-btn-active ui-state-persist">Main</a>
            </li>
            <li>
                <a href="#" data-role="tab" data-icon="gear" data-transition="none" class="fastClick">Settings</a>
            </li>
        </ul>       
    </div>
</div><!--header-wrapper ends-->
<div id="content-wrapper">
 .........
</div><!--content-wrapper ends--> 
<div data-role="footer" data-position="fixed" data-theme="a">
</div><!--footer ends-->

/www/js/MainPage.js

currentPage = {};
currentPage.init = function() {
$.getScript(path + "css/MainPage.css");
};

/www/css/MainPage.css

.navBtns {
display: block;
clear: both;
}
.......
a#mine{
background-color: #fdedb1;
}

Answer 1

MainPage.js中是否定义了变量路径？我猜这不是因为它超出了范围。通过发出警报（路径）来测试它;在MainPage.js。

带有phonegap和jquery mobile的$ .getScript和css问题

1 个答案: