Jquery代码在jQuery移动项目中不起作用

时间:2015-12-12 19:20:56

标签: jquery cordova jquery-mobile google-maps-api-3 maps

我正在使用jQuery Mobile库与Cordova开发混合应用程序。 由于我需要显示我使用的地图并编辑了here找到的代码,但似乎它无法识别代码的第一行。

Geolocation.js

$(document).on("pagecreate", "#map-page", function() { //doesn't work
    alert('hello');

    function initMap() {
        var defaultLatLng = new google.maps.LatLng(44.494887, 11.342616300000032); //Bologna      
        drawMap(defaultLatLng);
    }

     function drawMap(latlng) {
         var myOptions = {
             zoom: 17,
             center: latlng,
         };

         var map = new google.maps.Map(document.getElementById("map-canvas"), myOptions);

         var marker = new google.maps.Marker({
             position: latlng,
             map: map,
             title: "Parcheggio"
         });
    }
});

Html容器与演示相同。我已经包含的脚本:

<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="js/geolocation.js"></script>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD91dMkAWwADchy-WY1-5O7P6nHmjGont0
&callback=initMap"></script>

我还尝试更改API密钥,但没有任何变化。 你知道如何解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

您应该在document.ready块中移动事件绑定。

$(document).ready(function(){
    $(document).on("pagecreate", "#map-page", function() {
      ....
   });
});

此外,在jquery包含后包括Geolocation.js。