Question

我有jquery ui模态对话框。使用ajax调用jquery ui对话框内容显示。我的问题是当我打开jquery对话框时第一次成功加载地图。第二次打开对话框时无法在对话框中加载地图。我已经尝试检查但是第二次打开对话框时div的内容为空。

我尝试了很多stackoverflow的答案，但它们对我不起作用。因为我不只是对话问题。我想我可能有问题也来自ajax的内容。你可以看到我的谷歌地图api功能来显示地图。

addChild

我的jquery ui对话框（地图）从ajax调用中获取内容。

你可以帮助解决我的问题。

请参阅我的下方div以进行googlemap显示。这是我的ajax电话的回应

 var map = '';
  function googleMap(selector, lat, lng) {
     alert(map);
       var myLatlng = new google.maps.LatLng(lat, lng);
        // var map;
        var mapOptions = {
          zoom: 4,
         center: new google.maps.LatLng(23.6459, 81.9217),
           mapTypeId: google.maps.MapTypeId.ROADMAP
             };
       if (!map) {
             map = new google.maps.Map(document.getElementById('googlemaps'), mapOptions);
                      var marker = new google.maps.Marker({
                                        position: map.getCenter(),
                                        map: map
                                    });
        google.maps.event.addListener(map, "click", function () {
       document.getElementById("latitude").value = map.getCenter().lat();
        document.getElementById("longitude").value = map.getCenter().lng();
         marker.setPosition(map.getCenter());
});
} else {
              google.maps.event.trigger(map, "resize");
              map.setOptions(mapOptions);
                        }
 }

上面的div包含我的谷歌地图。第一次打开jquery ui对话框地图加载成功但是当打开第二次时间地图div变为空白时。

我的带有jquery ui对话框的ajax代码

 <div id="googlemaps">

  </div>

Answer 1

我在工作2天后找到了答案。首先需要将ajax内容加载到jquery ui对话框中。请将 autoopen：false 保留为对话框，并在内容加载到对话框后将其打开。

然后为ui对话框打开方法，这样对话框就可以在jquery ui对话框中加载ajax加载内容中的google map。

谷歌地图渲染问题在ajax jquery ui模态对话框中

1 个答案: