Deviceready总是在第二页触发，而不是在第一页

我是phonegap框架开发android应用程序的初学者。我有以下问题:

我的页面结构如下:

    <!DOCTYPE HTML>
    <html>
     <head>
    <script type="text/javascript">
    $(function(){
    document.addEventListener("deviceready", function onDeviceReady(){
                                                alert("Device Ready")                                                
                                              }, true);
    });
   </script>
</head>
<body>
<div id="page1" data-role="page" data-quicklinks="true" > 
  <a href="#page2"> Go to Page 2</a>
</div>
<div id="page2" data-role="page" data-quicklinks="true" > 
  <a href="#page1"> Go to Page 1</a>
</div>
</body>
</html>

当我打开文档时，我看到#page1的内容，但是看不到"设备就绪"的警告，但是当我点击链接到#page2时，"设备就绪"的警告出现了。当我第一次打开页面时，我想要设备准备好被触发，我真的不知道如何处理它。我试着在#page1div内插入JS代码，仍然没有效果。

请告诉我我哪里做错了。

这是我使用的完整代码:我有jQuery库存储在我的本地文件夹，因为我需要离线运行。在本地文件夹中也有cordova.js。

<!DOCTYPE HTML>
<html>
<head>
<script src="js/jquery.js"></script> 
 <script src="jquery_mobile/jquery.mobile-1.4.3.js"></script>
  <!--PhoneGap Libraries --> 
  <script src="cordova.js"></script>
</head>
<body>
  <div id="page1" data-role="page" data-quicklinks="true" > 
    <a href="#page2" rel="external"> Go to Page 2</a>
  </div>
  <div id="page2" data-role="page" data-quicklinks="true" > 
    <a href="#page1" rel="external"> Go to Page 1</a>
  </div>
  <script type="text/javascript">
    document.addEventListener("deviceready", function onDeviceReady(){
      alert("Device Ready");                                                
    }, true);
  </script>
</body>
</html>

您需要删除$函数调用，并将其直接放置在<script>标记中，如下所示

<script type="text/javascript">
   document.addEventListener("deviceready", function onDeviceReady(){
                                                alert("Device Ready")                                                
                                              }, true);
</script>

您需要将脚本放置在页面末尾:

<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
  <div id="page1" data-role="page" data-quicklinks="true" > 
    <a href="#page2"> Go to Page 2</a>
  </div>
  <div id="page2" data-role="page" data-quicklinks="true" > 
    <a href="#page1"> Go to Page 1</a>
  </div>
  <script type="text/javascript">
    document.addEventListener("deviceready", function onDeviceReady(){
      alert("Device Ready")                                                
    }, true);
  </script>
</body>
</html>

添加jquery移动库&cordova.js

<!--jquery mobile libraries -->
<script type="text/javascript" src="cordova.js"></script>

然后

<script type="text/javascript">
document.addEventListener("deviceready", function onDeviceReady(){ alert("Device Ready") }, true);
</script>

相关内容

最新更新

热门标签：