Leaflet.Draw 将标记保存到数据库

Question

我正在尝试使用字段

将标记保存到数据库

lat, lon , marker description.

如果地图上只有一个标记，一切都很好，但是当我添加第二个标记时，我的代码生成 2 sql-s 而不是 1，并复制第一个添加的标记信息。

这是我的代码：

map.on('draw:created', function (e) {
  var type = e.layerType;
  var layer = e.layer;
  var marker_lat = layer._latlng.lat;
  var marker_lng = layer._latlng.lng;

// Here I open Popup to save Marker discription
    $('#point_description').modal('show');

    // Here save marker lat, Lng + marker description 
    $(document).on('click', '#save_point', function () {
        var point_description_text = $('#point_description_text').val();
        insertPlaques(marker_lat, marker_lng, point_description_text, modal_window);
    });


  drawnItems.addLayer(layer);

});

Answer 1

每次 Leaflet.Draw 创建新形状时，您的 'draw:created' 函数都会被调用。每次调用该方法时，都会将一个新的 on 'click' 侦听器添加到“#save_point”元素。所以第二次 'draw:created' 被调用（并且用户点击'#save_point'），将调用两个监听器。第三次，会调用三个监听器。

您应该在调用 insertPlaques 方法后使用 off() 删除点击监听器，或者考虑使用 one() 之类的方法来添加点击监听器而不是 on()（https://api.jquery.com/one/)

Leaflet.Draw 将标记保存到数据库

Leaflet.Draw save marker to DB

leaflet