我正在使用jquery和Google Maps V3 API向Google Maps动态添加标记。当按钮search_button被点击时,一个请求被使用AJAX,它返回经纬度的对应于该结果,这将被用于放置标记物的JSON数组发送到服务器。但是在我的Javascript Conole中,出现错误:Invalid value for property <map>: map。我哪里做错了?这是我的代码:
search_button
Invalid value for property <map>: map
HTML标头JS:
<script type="text/javascript"> function initialize() { var latlng = new google.maps.LatLng(42.354183,-71.065063); var options = { zoom: 15, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), options); } </script>
jQuery的
$(function() { $("#search_button").click(function(e){ e.preventDefault(); // Place markers on map for( i = 0; i < json.length; i++) { var latLng = new google.maps.LatLng(json[i].lat, json[i].lng); var marker = new google.maps.Marker({ position: latLng, map: map }); } }); }); });
您应该将全局变量称为map。就是这样,实际上我的建议是将所有内容都移到这样的javascript文件中
$(document).ready(initialize); var map; function initialize() { var latlng = new google.maps.LatLng(42.354183,-71.065063); var options = { zoom: 15, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map($('#map-canvas')[0], options); $("#search_button").click(function(e){ e.preventDefault(); // Place markers on map for( i = 0; i < json.length; i++) { var latLng = new google.maps.LatLng(json[i].lat, json[i].lng); var marker = new google.maps.Marker({ position: latLng, map: map }); } }); }