Jquery：通过Ajax加载GoogleMaps会出现空白屏幕

Question

我正在使用Jquery获取googlemap数据并将其加载到div中。我的googlemap来自位于用户控件上的MVCMaps控件。我的代码如下：

$.get('<%= Url.Action("GetMapHtml", "Post") %>', function(data) {
     $('#MapWndCont').html(data);
});

我的控制器方法：

 public ActionResult GetMapHtml()
 {
     return PartialView("MapHtml", null);
 }

AJAX调用完成并收到数据后，如下所示（这是正确的，并在静态显示时正确显示：

<h3>Google Map</h3>
<div id="divG4158336" class="GoogleMap"></div><script type='text/javascript' src='/WebResource.axd?d=rgm3O6ZOAFRTPnYXcBL7BZMf7PKdndsbCMbyc33Gins1&t=633980535391370000'></script>
<script type='text/javascript' src='http://maps.google.com/maps?file=api&v=2&key=abcdefg&sensor=false'></script>
<script type='text/javascript' src='/WebResource.axd?d=rgm3O6ZOAFRTPnYXcBL7BbNjHCL588M7IBh7laWKeqs1&t=633980535391370000'></script>
<script type='text/javascript'>
var G4158336 = null;$(function(){G4158336=new MvcMaps.GoogleMap('divG4158336',{id:'G4158336',lat:39.9097362345372,lng:-97.470703125,zoom:4,maptype:G_NORMAL_MAP});});</script>

之后收到并放在#MapWndCont容器中。发生以下情况：

这是另外两个GET请求，这些请求来自从Google地图加载的脚本。他们被解雇的那一刻，我的页面一片空白，一切都没有显示出来。身体元素也被删除。在您看到第二个ajax调用的图像中。之后，整个页面都会删除html和脚本。因此，在该调用之后的脚本正在执行，并且无法找到它们。

在纠正此问题并动态加载谷歌地图时，我们非常感谢所有帮助。

谢谢，

编辑：BinaryKitten告诉我freenode上的#JQuery聊天。 document.ready（）在ajax调用的数据中。现在我的问题是从MVCMAPS控件中删除它。

Answer 1

我可能遗漏了一些明显的东西，但是您的JavaScript控制台似乎抱怨$未定义。

你肯定在页面上包含jQuery吗？例如。 $('body')在控制台中工作吗？

Answer 2

解决问题的一种方法是使用不使用Javascript的Google-Maps版本。 （静态Api）