Javascript 创建传单自定义复选框控件

我想创建一个自定义复选框控件，它只需在jquery/javascript中设置一个标志：如果选中标志='clustered'，或者如果未选中标志='unclustered'。到目前为止，我在地图上有一个控件，但它不是一个复选框，我如何获取复选框的状态-如果它是选中/未选中的

代码：

---

您必须在controlDiv中使用input type=“checkbox”创建表单元素

// create the control
var command = L.control({position: 'topright'});

command.onAdd = function (map) {
    var div = L.DomUtil.create('div', 'command');

    div.innerHTML = '<form><input id="command" type="checkbox"/>command</form>'; 
    return div;
};

command.addTo(map);


// add the event handler
function handleCommand() {
   alert("Clicked, checked = " + this.checked);
}

document.getElementById ("command").addEventListener ("click", handleCommand, false);

//创建控件
var命令=L.control（{position:'topright'}）；
command.onAdd=函数（映射）{
var div=L.DomUtil.create（'div'，'command'）；
div.innerHTML='command'；
返回div；
};
addTo命令（map）；
//添加事件处理程序
函数handleCommand（）{
警报（“单击，选中=”+此。选中）；
}
document.getElementById（“命令”）.addEventListener（“单击”，handleCommand，false）；

在这个jsfiddle中工作

---

你也可以通过阅读本手册的方式来获得提示：

偶然发现了这一点，尽管被接受的答案为我指明了正确的方向，但我还是选择了添加适当的

css

类

function toggleFunction(bool) {
  alert(bool)
}

var command = L.control({position: 'topright'});
command.onAdd = function (map) {
    var div = L.DomUtil.create('div');
    div.innerHTML = `
    <div class="leaflet-control-layers leaflet-control-layers-expanded">
      <form>
        <input class="leaflet-control-layers-overlays" id="command" 
          onclick=toggleFunction(this.checked) type="checkbox">
          Toggle
        </input>
      </form>
    </div>`; 
    return div;
};
command.addTo(mymap); //your map variable

功能切换功能（bool）{
警报（bool）
}
var命令=L.control（{position:'topright'}）；
command.onAdd=函数（映射）{
var div=L.DomUtil.create（'div'）；
div.innerHTML=`
切换
`; 
返回div；
};
command.addTo（mymap）//你的地图变量

结果:

---

你能帮我举个例子吗，因为我不能让它工作。按上述表格填写。

function toggleFunction(bool) {
  alert(bool)
}

var command = L.control({position: 'topright'});
command.onAdd = function (map) {
    var div = L.DomUtil.create('div');
    div.innerHTML = `
    <div class="leaflet-control-layers leaflet-control-layers-expanded">
      <form>
        <input class="leaflet-control-layers-overlays" id="command" 
          onclick=toggleFunction(this.checked) type="checkbox">
          Toggle
        </input>
      </form>
    </div>`; 
    return div;
};
command.addTo(mymap); //your map variable