2015-03-02 68 views
0

這裏是我的文件。

/www/js/index.js保持原樣。

頁面流應該是:應用程序啓動 - > index.html的 - >負載MainPage.html從indexB.js - > 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--> 

/網絡/ 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; 
} 

回答

0

是在MainPage.js定義的變量路徑?我猜這不是因爲它超出了範圍。通過放置警報(路徑)來測試它;在MainPage.js中。