谷歌地图和jQuery UI对话框

我有一个有趣的问题，我的班级的任务，我们应该有一个jQuery-UI模式对话框出现时，用户点击一个谷歌地图。谷歌地图和jQuery UI对话框

在我的第一个示例中，我使用jQuery-UI模式对话框可以在与地图相同的页面上正常工作。 http://ymartino.userworld.com/map-practice3a.html

然而，在我的第二个例子中，当我尝试将它集成到地图本身中时，Modal div会出现，但对话框不会。 http://ymartino.userworld.com/map-practice3b.html

编辑我怀疑的问题是，一些可能仅仅是不正确的顺序。

来源

2011-06-06 VikingGoat

下面是一个例子来说明它是如何完成的。

为了便于理解，我保留了一些您尝试的元素（如onload="initialize()"，我倾向于用$.ready()替代）。我还删除了一些您可能需要的功能，但如果您了解自己的代码，则该功能应该很容易恢复。

希望你能够理解发生了什么，然后将你的理解运用到你的任务中。祝你好运！

<body onload="initialize()"> 
<script type="text/javascript"> 
    function initialize() { 
    var location = new google.maps.LatLng(37.437412,-122.15641); 
    var myOptions = { 
     zoom:13, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: location 
    } 
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    google.maps.event.addListener(map, 'click', function(event) { 
     var $dialog = $("#dialog").dialog({ 
      autoOpen: false, 
      title: 'Dialog Title', 
      modal: true 
     }); 
     $dialog.dialog('open'); 
    }); 
    } 
</script> 

<div id="dialog"></div> 
<div id="map_canvas" style="border: 1px solid black; position:absolute; width:398px; height:398px"></div> 
</body>

来源

2011-06-07 02:58:02 Trott

啊，我明白你在那里做了什么;所以它是无序的，非常感谢。我同意$ .ready（）的建议，我也会做这个改变。再次感谢。 – VikingGoat 2011-06-07 03:14:29

谷歌地图和jQuery UI对话框

回答

相关问题