从链接调用Google地图v3中的事件侦听器

Question

我试图从链接调用google.maps.event.addListener。这里是我的代码至今：

 var divcc = '#badaba'; //click color 
      var divhc = '#ffffce'; //hover color 
      var divoc = '#FFF'; //original color 
      var lastopenwin; 
      var marker1; 
     var marker2; 
//MAP--------------------------------------------------- 
    function initialize() { 
    //pin icons 
    var image1 = '../images/marker.png'; 
    var temp1 = new google.maps.MarkerImage(image1); 
    var image2 = '../images/coldmarker.png'; 
    var temp2 = new google.maps.MarkerImage(image2); 
    //pins coords 
    var latlng1 = new google.maps.LatLng(33.528782,-112.343972); 
    var latlng2 = new google.maps.LatLng(32.996381,-112.231125); 
    //info windows 
    var content1 = '<div style="width:300px;">Hello World!!!</div>'; 
    var infowindow1 = new google.maps.InfoWindow({ 
      content: content1 
     }); 
    var content2 = '<div style="width:300px;">Hello Universe!!!</div>'; 
    var infowindow2 = new google.maps.InfoWindow({ 
      content: content2 
     }); 
    //map options 
    var myOptions = { 
     zoom: 8, 
     center: latlng1, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    //place map 
    var map = new google.maps.Map(document.getElementById("map_canvas"), 
     myOptions); 

    //place pins 
    var marker1 = new google.maps.Marker({ 
      position: latlng1, 
      icon: temp1, 
      title:"Hello World!" 
    }); 
    marker1.setMap(map); 
    var marker2 = new google.maps.Marker({ 
      position: latlng2, 
      icon: temp1, 
      title:"Hello Universe!" 
    }); 
    marker2.setMap(map); 
    //listeners 
    google.maps.event.addListener(marker1, 'click', function() { 
     //alert(lastopenwin); 
     if(lastopenwin){ 
      //alert(lastopenwin); 
      lastopenwin.close(); 
     } 
     document.getElementById("item1").style.background = divcc; 
      infowindow1.open(map,marker1); 
      lastopenwin = infowindow1; 
     }); 
     google.maps.event.addListener(marker1, 'mouseover', function() { 
      document.getElementById("item1").style.background = divhc; 
      marker1.setIcon(temp2); 
     }); 
     google.maps.event.addListener(marker1, 'mouseout', function() { 
      document.getElementById("item1").style.background = divoc; 
      marker1.setIcon(temp1); 
     }); 
     google.maps.event.addListener(marker2, 'click', function() { 
      //alert(lastopenwin); 
      if(lastopenwin){ 
       lastopenwin.close(); 
      } 
      document.getElementById("item2").style.background = divcc; 
      infowindow2.open(map,marker2); 
      lastopenwin = infowindow2; 
     }); 
     google.maps.event.addListener(marker2, 'mouseover', function() { 
      document.getElementById("item2").style.background = divhc; 
      marker2.setIcon(temp2); 
     }); 
     google.maps.event.addListener(marker2, 'mouseout', function() { 
      document.getElementById("item2").style.background = divoc; 
      marker2.setIcon(temp1); 
     });   
} 

我使用的尝试触发图中的事件在我的链接是什么：

href="javascript:google.maps.event.trigger(marker2, 'click');" 

这是行不通的。任何人有想法？

Answer 1

问题是，您正在引用全局范围中不存在的变量。

为了说明发生了什么，考虑下面的代码：

function initialize() { 
    var my_local_variable = "Hello there!"; 
    alert("From function scope: " + my_local_variable) 
} 
initialize(); 
// Will alert "From function scope: Hello there!" 
alert("From global scope: " + my_local_variable); 
// Will alert "From global scope: undefined" 

你做同样的事情在你的initialize功能与​​。解决方法是使用initialize函数中的google.maps.event.addListener()函数来监听链接中的点击事件。那就是：

google.maps.event.addListener(
     document.getElementById("your_link_id"), 
     'click', 
     function() { 
      // Work your magic here 
});