确定何时单击Leaflet Draw取消按钮

Ed *_*nce 5 javascript leaflet leaflet.draw

问题

我正在使用传单绘制我的应用程序,我有'删除'按钮激活.删除按钮有三个选项:

  1. Save
  2. Cancel
  3. Clear All

我希望foo()在用户点击时调用函数Save,但是,我希望bar()在单击时调用函数Cancel.

现场演示

我知道这可以通过简单地给它一个ID,并添加一个事件监听器来实现,但它并不像我认为的那样干净.

理想解决方案

Leaflet绘制了自己的方法,用于检测按钮何时被按下,但在我看来,它们只能在更高的级别上进行.例如:

draw:deletestop这是编辑的类型.其中之一:删除当用户完成删除形状(删除模式)并保存时触发.

- 传单文件

这允许我foo()在用户选择三个选项中的任何一个后调用,表示他们已完成处理删除按钮交互.

我无法在文档中找到一种方法,能够在按下的各个按钮上侦听传单绘制触发事件.

Sea*_*wer 2

取消/禁用函数的处理程序存储为实例的一部分L.Control.Draw。因此,您可以在实例化L.Control.Draw对象后立即修改处理程序:

var myDrawControl = new L.Control.Draw();

myDrawControl._toolbars.edit.disable =  function () {
  if (!this.enabled()) {
    /* If you need to do something right as the
       edit tool is enabled, do it here right
       before the return */
    return;
  }

  this._activeMode.handler.revertLayers();
  /* If you need to do something when the
     cancel button is pressed and the edits
     are reverted, do it here. */
  L.Toolbar.prototype.disable.call(this);
};
Run Code Online (Sandbox Code Playgroud)

处理程序的源代码在这里,虽然效果很好,但您必须小心 Leaflet.Draw 的未来版本,它可能会更改处理程序的功能。