Javascript 如何在传单地图中仅添加一个标记

我正在用户单击地图上添加标记。
问题是，我只需要一个标记，但现在每当我单击地图时，就会添加新标记。
我正试图删除它，但什么也没发生：

var marker;
    map.on('click', function (e) {
        map.removeLayer(marker)

        marker = new L.Marker(e.latlng, { draggable: true });
        marker.bindPopup("<strong>" + e.latlng + "</strong>").addTo(map);

        marker.on('dragend', markerDrag);
    });

var标记；
地图上（'点击'）功能（e）{
地图移除层（标记）
marker=新的L.marker（e.latlng，{draggable:true}）；
marker.bindpoop（“”+e.latlng+“”）.addTo（地图）；
marker.on（'dragend'，markerDrag）；
});

用于解除单击事件的绑定

应该是这样的：

var marker;
map.on('click', mapClicked);

function mapClicked(e) {
    map.off('click', mapClicked);
    map.removeLayer(marker)

    marker = new L.Marker(e.latlng, { draggable: true });
    marker.bindPopup("<strong>" + e.latlng + "</strong>").addTo(map);

    marker.on('dragend', markerDrag);
}

var标记；
地图上（'点击'，地图点击）；
函数映射（e）{
map.off（'click'，map clicked）；
地图移除层（标记）
marker=新的L.marker（e.latlng，{draggable:true}）；
marker.bindpoop（“”+e.latlng+“”）.addTo（地图）；
marker.on（'dragend'，markerDrag）；
}

---

我没有对它进行测试，但它至少应该让您走上正确的方向。

而不是使用

。在

上，您可以使用

。一次

。这样，事件将只捕获一次，处理程序将在此之后解除绑定

map.on('click', function () {
    console.log('I fire every click');
});

map.once('click', function () {
    console.log('I fire only once');
});

如果您需要自己解除绑定处理程序，可以使用

.off

。检查事件方法的引用：

至于上面的代码不起作用的原因，在第一次单击时，您正在尝试删除标记：

map.removeLayer（marker）

，但变量

marker

不包含L.marker实例，因此映射无法删除它。您应该先检查它是否已定义，然后再删除它：

var marker;
map.on('click', function (e) {
    if (marker) { // check
        map.removeLayer(marker); // remove
    }
    marker = new L.Marker(e.latlng); // set
});

---

以下是关于Plunker的一个工作示例：

绝对没有理由引入另一个库，因为传单有自己的绑定和解除绑定事件的方法：