谷歌地圖apiv3，每個標記具有相同的點擊功能

我似乎遇到了一個問題，我看到很多信息框的實現，但似乎無法弄清楚如何將另一段代碼插入標記。我對JavaScript很沒有經驗，所以我似乎無法弄清楚。谷歌地圖apiv3，每個標記具有相同的點擊功能

當我去映射它顯示了所有的標誌物，但只有選擇一段代碼是最後的陣列中，

代碼：

function updateMap() { 
    var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 4, 
    center: locationarray[0] 
    }); 
    var markernumber = new Array(); 
    for (var i = 0; i < 99; i++) { 
    markernumber[i] = new google.maps.Marker({ 
     position: locationarray[i], 
     map: map 
    }); 
    console.log('in loop:' + i); 
    google.maps.event.addListener(markernumber[i], 'click', function() { 
     console.log('in click:' + i); 
     openInNewTab(contentString[i]); 
    }); 
    } 
    document.getElementById('loader').style = "opacity: 0;"; 
}

contentstring [i]的工作正常，所以它沒有這個功能。

來源

2017-10-19 CosmicS

'谷歌地圖apiv3給每個標記相同的點擊function' - 不，你正在做的...'i'內的事件處理程序將是100，每標記點擊。想關閉 –

[Google Maps JS API v3 - 簡單多標記示例]的可能重複（https://stackoverflow.com/questions/3059044/google-maps-js-api-v3-simple-multiple-marker-example） – geocodezip

-1

嘗試類似的東西：

var markernumber = new Array(); 
    for (var i = 0; i < 4; i++) { 
     markernumber[i] = new google.maps.Marker({ 
      position: position[i], 
      map: map 
     }); 
     console.log('in loop:' + i); 
     (function (i, content, marker) { 

      google.maps.event.addListener(marker, 'click', function (e) { 
       console.log('in click:' + i); 
       //console.log(e); 
      }); 

     })(i, contentString[i], markernumber[i]); 
    }

你已經得到了一個閉合的錯誤。這意味着當聽者將被執行時，i值已經改變（進入for）並且它傳遞到99.

按順序解釋。當你打電話給i，或者你想要的變量時，系統會嘗試用這個名字找到最後一個值。所以，如果值發生變化，結果將是變量的最後一次「更新」。

在這裏，當你嘗試讀取i你曾經「更新」 i在for所以最後值將是99

如果你想在你的聽衆閱讀的i的價值，你必須創建一個IIFE並傳入參數i,contentString和markernumber的實際值。

如果你想了解關於閉包的更多細節或者關於IIFE的here，請參考documentation（你必須在文檔中找到一點，但是有一段文字，它是最好的，可以找到的）。

告訴我，如果你有一些問題

來源

2017-10-19 16:11:49

不好意思，我的先例文章包含錯誤，但現在通常沒問題。 –

谷歌地圖apiv3，每個標記具有相同的點擊功能

回答

相關問題