4

Javascript 在 index.html 页面之外不起作用:

项目测试1:

Index.html(带有地理定位页面代码)工作正常

项目测试 2:

Index.html(带有菜单页码)

Geolocation.html(带有 GEOLOCATION PAGE CODE)javascript 不起作用

Geolocation.html 页面打开,但 javascript 不运行。

我错过了什么?

地理位置页面代码:

<!DOCTYPE html>
<html>
  <head>
    <!-- <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />-->
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map_canvas { height: 100% }
    </style>
    <script type="text/javascript" charset="utf-8" src="js/cordova-2.5.0.js"></script>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false">
    </script>
    <script type="text/javascript">

    document.addEventListener("deviceready", onDeviceReady, false);

    function onDeviceReady() {
        var element = document.getElementById('geoTemp');
        element.innerHTML = 'Ready...';
        navigator.geolocation.getCurrentPosition(onSuccess, onError, { maximumAge: 3000, timeout: 10000, enableHighAccuracy: false });
    }

    function onSuccess(position) {
        var element = document.getElementById('geoTemp');
        element.innerHTML = 'Success...';                                    
        initialize(position.coords.latitude, position.coords.longitude);                            
    }

    function onError(error) {
        var element = document.getElementById('geoTemp');
        element.innerHTML = 'Error...';
        alert('code: '    + error.code    + '\n' +
                'message: ' + error.message + '\n');
    }

      function initialize(latitude, longitude) {
        var mapOptions = {
          center: new google.maps.LatLng(latitude, longitude),
          zoom: 12,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);
      }

      function onBodyLoad(){
          alert("test!");
      }
    </script>
  </head>
  <body>
    <h2>Location</h2>               
                <p id="geolocation">Finding geolocation...</p>
                <p id="geoTemp"></p>
    <div id="map_canvas" style="width:100%; height:100%"></div>
  </body>
</html>

菜单页码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
<link rel="stylesheet" href="css/themes/default/jquery.mobile-1.3.0.css">
<link rel="shortcut icon" href="favicon.ico">
<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.3.0.js"></script>
<script type="text/javascript" src="js/cordova-2.5.0.js"></script>
</head>
<body>
    <div data-role="page" id="pageMain">

        <div data-role="header">
            <h1>
                TestPage
            </h1>
        </div>


        <div data-role="content">

            <ul data-role="listview">
                <li><a href="geolocation.html" data-transition="slide">
                        <h2>Geolocation Test</h2>
                        <p>Testing</p>
                </a></li>
            </ul>
        </div>
    </div>
</body>
</html>

我还尝试将 onload 函数添加到 body 标记并调用测试函数,但它也不起作用。

4

1 回答 1

5

在 geolocation.html 的链接中,添加此属性data-ajax="false"。这将阻止 jQuery 通过 Ajax 加载页面。

于 2013-04-06T09:56:38.140 回答