问题：

在使用自定义图层控件时，关闭/打开图层可以正常工作，但是我似乎无法弄清楚如何从地图中删除图层后从输入框中删除复选标记。

这是我的设置：

我的HTML（请注意，通过L.Control.extend（）执行此操作）：

<input type="checkbox" id="airfields" class="check">Airfields
<input type="checkbox" id="docks" class="check">Docks
... and so on

我的JS：

$(".check").change(function(){
    var layerClicked = $(this).attr("id");
        switch(layerClicked){
            case "airfields":
                if (map.haslayer(airfields)){
                     map.removeLayer(airfields);
                } else {
                      map.addLayer(airfields);
                }
             break;
           // ...and so on...
         }
      });

上面的代码显然会从地图中删除图层，但它不会从输入元素中删除复选标记。

Answer 1

如果我的理解是正确的，那么您错过了一个“全部清除”按钮，该按钮会取消勾选所有复选框，并从地图中删除关联的图层？

在这种情况下，您只需按下按钮，检索所有复选框，读取是否已选中，如果是，则触发"change"事件并取消勾选。

$("#clearAll").click(function(event) {
  event.preventDefault();

  $(".check").each(function(i, el) {
    if (el.checked) {
      // Trigger the event.
      $(el).change();
      // Untick the checkbox.
      el.checked = false;
    }
  })
});

演示：http://jsfiddle.net/3v7hd2vx/43/

注意：通过在输入更改时读取checked属性并相应地删除/添加图层，而不是在地图上测试图层存在，您可以稍微简化一下。使用您的方法，您最终可能会出现不同步的复选框（勾选而图层将从地图中移除，反之亦然）。

类似的东西：

if (this.checked) { map.addLayer(layer); }
else { map.removeLayer(layer); }

如何清除所有图层和清除输入复选框？

问题：

1 个答案: