Fatal编程技术网
  • javascript/
  • Phonegap-页面显示但不显示'；不加载javascript

Phonegap-页面显示但不显示'；不加载javascript

javascript android html cordova

Phonegap-页面显示但不显示'；不加载javascript,javascript,android,html,cordova,Javascript,Android,Html,Cordova,我有以下两个html文件（简化以显示我遇到的问题）： Index.html <html> <head> <meta charset="utf-8" /> <meta name="format-detection" content="telephone=no" /> <meta name="msapplication-tap-highlight" content="no" /> <!-- WARNING: for iOS 7, re

我有以下两个html文件（简化以显示我遇到的问题）：

Index.html

<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport"
    content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<link rel="stylesheet" type="text/css" href="jquery.mobile-1.4.3.css">
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="jquery.mobile-1.4.3.js"></script>
<script type="text/javascript" src="cordova.js"></script>

</head>
<body onload="app.initialize();">

<a href="calendar.html">My Calendar</a>

</body>
</html>
现在，当应用程序第一次启动时，会显示消息“index.html”发出警报。 但在那之后，每次我点击链接在两个页面之间跳转时，都会显示内容（指向另一个页面的相应链接），但我没有收到任何警报，这意味着javascript不会再次加载。但是如果我刷新页面，就会显示警报。我希望它能够在不刷新页面的情况下加载javascript

谢谢，

之所以会发生这种情况，是因为在您选择下一页时，设备已经准备就绪，因此不会再次触发“deviceready”事件

我会将这两个页面的结构更改为：

<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport"
    content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<link rel="stylesheet" type="text/css" href="jquery.mobile-1.4.3.css">
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="jquery.mobile-1.4.3.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="cordova.js"></script>

</head>
<body>

<a href="calendar.html">My Calendar</a>

</body>
</html>
现在，每当我点击“我的日历”时，它就会提醒“index.html”，当我希望它提醒“Calendar.html”时，当我点击“index”时，它就会返回到index.html，而没有任何提醒。它从不提醒“calendar.html”，我已将事件更改为在显示时启动，而不是更改。由于jquerymobile加载页面的方式，“location”属性将不起作用。在上面的代码中尝试更jQuery-mobile特定的方式。好的，我现在修复了：）使用了在目标页面上触发的“pageshow”事件。谢谢你的帮助，不用担心。快乐编码：） 
var app = {

        initialize: function() {
            this.bindEvents()
        },

        bindEvents: function() {
            document.addEventListener('deviceready', this.onDeviceReady, false)
        },

        onDeviceReady: function() {
            app.receivedEvent('deviceready')
        },

        receivedEvent: function(id){

            alert(location.pathname.substring(location.pathname.lastIndexOf("/") + 1))

        }

}

<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport"
    content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<link rel="stylesheet" type="text/css" href="jquery.mobile-1.4.3.css">
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="jquery.mobile-1.4.3.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="cordova.js"></script>

</head>
<body>

<a href="calendar.html">My Calendar</a>

</body>
</html>

$(document).ready(function(){
  app.initalize();
});

var app = {

        initialize: function() {
            this.bindEvents();
        },

        bindEvents: function() {
            document.addEventListener('deviceready', this.onDeviceReady, false);
            $(document).on("pagecontainershow", app.onDeviceReady);
        },

        onDeviceReady: function() {
            app.receivedEvent('deviceready')
        },

        receivedEvent: function(id){

            alert($.mobile.pageContainer.pagecontainer('getActivePage').data('url'));

        }

}