將信息窗口中的按鈕添加onclick功能

Question

我需要幫助，以使我的InfoWindow內容中的onclick功能起作用。

這裏是我的代碼的一部分：

for (i = 0; i < markers.length; i++) { 
 
    var position = new google.maps.LatLng(markers[i][0], markers[i][1]); 
 
    var icon = { 
 
     url:"http:///".concat(markers[i][3]), 
 
     scaledSize: new google.maps.Size(20, 20), // scaled size 
 
     origin: new google.maps.Point(0,0), // origin 
 
     anchor: new google.maps.Point(0, 0) 
 
    }; 
 
    marker = new google.maps.Marker({ 
 
     position: position, 
 
     map: map, 
 
     title: markers[i][4].toString().concat(' ').concat(markers[i][5].toString()), 
 
     icon: icon, 
 
     url:'im:<sip:'+markers[i][6]+'>' 
 
    }); 
 
    var infowindow = new google.maps.InfoWindow({ 
 
     content: '' 
 
    }); 
 
    marker.addListener('mouseover', function() { 
 
     infowindow.setContent('<p><label>Name:</label> '+this.title+'</p>' + 
 
      '<center><button class="btn btn-primary" \n\ 
 
      onclick="myFunction(){ window.location.assign(this.url);}">Call</button></center>'); 
 
     infowindow.open(map, this); 
 
    }); 
 
}

Answer 1

在你的onclick處理函數這將引用按鈕元素沒有標記的對象，這是因爲按鈕不像URL的任何財產爲什麼它不工作。

您可以使用標記與HREF重定向到所需的位置

試試這個：

for(i = 0; i < markers.length; i++) { 
var position = new google.maps.LatLng(markers[i][0], markers[i][1]); 
var icon = {url:"http:///".concat(markers[i][3]), 
      scaledSize: new google.maps.Size(20, 20), // scaled size 
      origin: new google.maps.Point(0,0), // origin 
      anchor: new google.maps.Point(0, 0) }; 
marker = new google.maps.Marker({ 
    position: position, 
    map: map, 
    title: markers[i][4].toString().concat(' ').concat(markers[i][5].toString()), 
    icon: icon, 
    url:'im:<sip:'+markers[i][6]+'>' 
}); 
var infowindow = new google.maps.InfoWindow({ 
      content: '' 
}); 
marker.addListener('mouseover', function() { 
    infowindow.setContent('<p><label>Name:</label> '+this.title+'</p>' + 
          '<center><a class="btn btn-primary" href="'+this.url+'">Call</a></center>'); 
    infowindow.open(map, this); 
}); 

Answer 2

的onclick處理程序不實際執行任何東西。你只需在其中定義一個函數。試試這個：

for(i = 0; i < markers.length; i++) { 
 
    var position = new google.maps.LatLng(markers[i][0], markers[i][1]); 
 
    var icon = {url:"http:///".concat(markers[i][3]), 
 
       scaledSize: new google.maps.Size(20, 20), // scaled size 
 
       origin: new google.maps.Point(0,0), // origin 
 
       anchor: new google.maps.Point(0, 0) }; 
 
    marker = new google.maps.Marker({ 
 
     position: position, 
 
     map: map, 
 
     title: markers[i][4].toString().concat(' ').concat(markers[i][5].toString()), 
 
     icon: icon, 
 
     url:'im:<sip:'+markers[i][6]+'>' 
 
    }); 
 
    var infowindow = new google.maps.InfoWindow({ 
 
       content: '' 
 
    }); 
 
    marker.addListener('mouseover', function() { 
 
     infowindow.setContent('<p><label>Name:</label> '+this.title+'</p>' + 
 
           '<center><button class="btn btn-primary" \n\ 
 
          onclick="window.location.assign(' + this.url + ');">Call</button></center>'); 
 
     infowindow.open(map, this); 
 
    });