2016-11-17 2 views
-1

InfoWindow 내부의 이미지에 onclick 이벤트를 추가하여 이미지를 클릭하면 Javascript 함수가 호출되도록하려고합니다.Google Maps InfoWindow 내부의 이미지에 onclick 이벤트 추가하기

"name"은 장소 이름이고 "image"는 이미지 위치입니다. 마커를 클릭하면 둘 다 잘 보이지만 이미지를 클릭하면 아무 일도 일어나지 않습니다.

var infowindow = new google.maps.InfoWindow({content: name + "</br>" + "<img 
onclick='output()' src='images/" + image +  
"'style=height:100px;width:100px;float:none;>"}); 
    google.maps.event.addListener(marker, 'click', function() { 
    infowindow.open(map,marker); 
    }); 
    function output() 
    { 
     $("#output").html("yes"); 
    } 

그리고 HTML :

나의 현재 코드는

<h1>My First Google Map</h1> 

<div id="map" style="width:60%;height:500px"></div> 
<div id="output"></div> 



</body> 
+0

게시 된 코드는 저에게 적합합니다 ([fiddle] (http : // jsfi ddle.net/geocodezip/L2tf6sru/4/)). 문제를 나타내는 [mcve]를 제공해주십시오. – geocodezip

답변

0

내 대답은 아니지만, 수도는에 이것을 이벤트를 트리거하는 방법이 주제 쇼에서, 당신을 도울 수 Google지도 Trigger event with infoWindow or InfoBox on click Google Map API V3 :

function addMarkers() 
    { 
     var marker, i; 
     var infowindow = new google.maps.InfoWindow({ 
      disableAutoPan: true 
      ,isHidden:false 
      ,pixelOffset: new google.maps.Size(-10, -10) 
      ,closeBoxURL: "" 
      ,pane: "mapPane" 
      ,enableEventPropagation: true 
     }); 
     for (var i = 0; i < cityList.length; i++) 
     { 
      marker = new google.maps.Marker({ 
       position: new google.maps.LatLng(cityList[i][1], cityList[i][2]), 
       map: map, 
       id: i, 
       title: cityList[i][0] 
      }); 

      var boxText = document.createElement("div"); 
      boxText.id = i; 
      boxText.className = "labelText" + i; 
      boxText.innerHTML = cityList[i][0]; 
      boxList.push(boxText); 

      google.maps.event.addListener(marker, 'click', (function(marker, i) { 
       var contentString = '<div id="infoWindow">' 
        +'<div id="bodyContent">' 
        +'<p>' 
        + "This location is:<br>" 
        + marker.title 
        +'</p>' 
        +'</div>' 
        + '</div>'; 

       return function() { 
        infowindow.setContent(boxList[this.id]); 
        infowindow.open(map, marker); 
       } 
       })(marker, i)); //end add marker listener 

       google.maps.event.addDomListener(boxList[i],'click',(function(marker, i) { 
         return function() { 
          alert('clicked ' + cityList[i][0]) 
         } 
         })(marker, i)); 
      } //endfor    
     }//end function