0

我正在研究 javascript 和 jquery。我创建了 2 个页面，第 1 个页面将生成当前位置的地图视图，如果我们单击当前位置，它将导航到下一页，该页面将找到用户的纬度和经度并生成天气报告。但是这两个页面都可以单独工作，但是在集成时会生成地图视图，但是当单击天气链接时，页面不会被加载。任何建议或帮助将不胜感激。我什至摆弄了http://jsfiddle.net/mJgdz/我的天气页面代码并将我的地理位置代码粘贴在下面：

我的 HTML 地理位置代码：

    <!DOCTYPE html>
     <html>
      <head>
       <title>Getting Geolocation for Weather Details</title>
   <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="UTF-8">
    <style type="text/css">
  html, body {
    height: 100%;
    margin: 0;
    padding: 0;
  }
  #map_canvas {
    height: 100%;
  }

  @media print {
    html, body {
      height: auto;
    }

    #map_canvas {
      height: 650px;
    }
  }
    </style>
   <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=true"></script>
   <script type="text/javascript">
  var map;

    function initialize() {
    var myOptions = {
      zoom: 16,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
     map = new google.maps.Map(document.getElementById('map_canvas'),
        myOptions);

      // Try HTML5 geolocation
      if(navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
        var pos = new google.maps.LatLng(position.coords.latitude,
                                         position.coords.longitude);

         var infowindow = new google.maps.InfoWindow({
          map: map,
          position: pos,
          content: '<a href="weatherdetails.html">click here for weather details</a>'
          });

          map.setCenter(pos);
          }, function() {
        handleNoGeolocation(true);
         });
        } else {
      // Browser doesn't support Geolocation
        handleNoGeolocation(false);
       }
      }

      function handleNoGeolocation(errorFlag) {
         if (errorFlag) {
      var content = 'Error: The Geolocation service failed.';
      } else {
        var content = 'Error: Your browser doesn\'t support geolocation.';
    }

    var options = {
      map: map,
      position: new google.maps.LatLng(60, 105),
      content: content
       };

       var infowindow = new google.maps.InfoWindow(options);
       map.setCenter(options.position);
     }

     google.maps.event.addDomListener(window, 'load', initialize);
      </script>
   </head>
   <body>
  <div id="map_canvas"></div>
   </body>
  </html>
4

0 回答 0