Javascript 谷歌地图弹出点击事件多次触发

我有一个带标记的谷歌地图。单击每个标记时，都会显示一个信息窗口。在infowindow中有一个按钮，用于向队列添加一些数据。在第一次单击“添加到队列”按钮时，它将触发一次，单击第二个按钮将触发两次，单击第三个按钮将触发三次，依此类推

google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
        $('.show-compare').popover('destroy');
        infowindow.setContent('<div class="add-wrapper"><div class="show-compare" data-toggle="popover" data-placement="top" data-content="Add to compare basket">CLICK ME</div></div>);
        infowindow.setOptions({maxWidth: 200});
        infowindow.open(map, marker);

        $('body').on("click", '.show-compare', function(e) {
                e.preventDefault();
                alert();//this fires x times, only should fire once per click!!

        }
    }) (marker, i));
}

google.maps.event.addListener（标记，'click'，（函数（标记，i）{
返回函数（）{
$（'.show compare'）.popover（'destroy'）；
infowindow.setContent（'单击我]；
setOptions（{maxWidth:200}）；
信息窗口。打开（地图、标记）；
$（'body'）。在（'click'，'show compare'，函数（e）上{
e、 预防默认值（）；
alert（）；//此命令触发x次，每次单击仅应触发一次！！
}
})（marker，i））；
}

---

帮助！谢谢：）

如果正在单击的按钮位于标记内，则单击事件可能会向上传播到标记，然后向按钮添加另一个单击事件。因此采用了1x、2x、3x、4x点火模式

尝试添加停止传播函数

$('body').on("click", '.show-compare', function(e) {
    e.preventDefault();
    e.stopPropagation();
    alert();
}

---

如果正在单击的按钮位于标记内部，则单击事件可能会向上传播到标记，然后向按钮添加另一个单击事件。因此采用了1x、2x、3x、4x点火模式

尝试添加停止传播函数

$('body').on("click", '.show-compare', function(e) {
    e.preventDefault();
    e.stopPropagation();
    alert();
}

---

代码所做的是：每次标记上有一个单击事件时，代码都会在body标记上注册另一个单击事件处理程序。你应该把它移到一边去

google.maps.event.addListener（标记，'click'，（函数（标记，i）

---

这样，您只需在body标记上注册一个click处理程序，代码所做的是：每次标记上有一个click事件时，您的代码都会在body标记上注册另一个click事件处理程序。您应该将它移到外侧

$('body').off("click", '.show-compare').one("click", '.show-compare', function(e) {
    e.preventDefault();
    e.stopPropagation();
    alert();
}

google.maps.event.addListener（标记，'click'，（函数（标记，i）

这样，您只需在body标记上注册一个单击处理程序

$('body').off("click", '.show-compare').one("click", '.show-compare', function(e) {
    e.preventDefault();
    e.stopPropagation();
    alert();
}

这对我有用

---

这对我来说很有效

我认为Loc bellow可能是正确的。将click listener移到addListener函数之外。我也会使它变得更好。

$（文档）。就绪（$（'.show compare'）。单击（函数（e）{e.preventDefault（）；alert（））

。然后将其移到所有内容之外。我无法将其移到外部，因为我在单击事件中使用了标记数据。我需要访问我单击的标记，我认为下面的命令可能是正确的。将单击侦听器移到addListener函数之外。我也会让它变得更好。

$（文档）。就绪（$（'.show compare'）。单击（函数（e）{e.preventDefault（）；alert（）}））

。把它移到外面。我不能把它移到外面，因为我在点击事件中使用了标记数据。我需要访问我点击的标记，因为我还没有足够的信誉来评论，我会在这里更新一个JSFIDLE来演示你可以移动

$（'body'）。在（“点击”，'.show compare'，函数（e）

在google marker click listener外部。这是@ryan的链接。因为我太懒了，我只是在通用地图上做了一个快速修复。希望你能阅读它，因为我还没有足够的声誉发表评论，我将在这里更新一个JSFIDLE，以演示你可以移动

$（'body'）。在（“单击”，'.show compare'，函数（e）

在google marker click listener外部。这是@ryan的链接。因为我太懒了，我只是在通用地图上做了一个快速修复。希望你能阅读它