Question

我在JavaScript中将事件处理程序设置为Google Maps标记时遇到了困难。以下是我的代码：

var map = new google.maps.Map(document.getElementById('map-canvas'), {
                zoom: 8,
                center: {lat: -35, lng: 149}
            });
            for (var i = 0; i < basketballCourts.length; i++) {
                var marker = new google.maps.Marker({
                    position: new google.maps.LatLng(basketballCourts[i].latitude, basketballCourts[i].longitude),
                    map: map,
                    title: 'Hello World!'
                });
                marker.set("data-index", i);
                google.maps.event.addListener(marker, 'click', function() {
                    console.log(marker.get("data-index"));
                });
            }

您会注意到标记有一个点击事件。但是，所有标记的点击事件相同。每次标记点击都应记录一个不同的数字，但无论我点击什么标记，我都会得到相同的响应。

我不知道如何解决这个问题。

Answer 1

发生了什么事情是你在所有的篮球场上循环，为每个标记创建一个事件监听器。这一切都很好。但是，该事件侦听器功能如下所示：

console.log(marker.get("data-index"));

该函数执行以响应标记点击，而不是在您定义时。函数执行时marker的值将是你在所有basketballCourts循环结束时的值。

使用@ MiltoxBeyond的建议，尝试使用this.get("data-index")

Google Maps JavaScript - 将多个标记添加到一个地图

1 个答案: