我想创建一个自定义复选框控件,它只需在
jquery /
javascript中设置一个标志：如果选中flag =’clustered’或者unchecked flag =’unclustered’.到目前为止,我在地图上有一个控件,但它不是一个复选框,如何获得复选框的状态 – 如果选中/取消选中.
码：
function MapShowCommand() {
alert("checked / unchecked"); //set flag
}
L.Control.Command = L.Control.extend({
options: {
position: 'topleft',},onAdd: function (map) {
var controlDiv = L.DomUtil.create('div','leaflet-control-command');
L.DomEvent
.addListener(controlDiv,'click',L.DomEvent.stopPropagation)
.addListener(controlDiv,L.DomEvent.preventDefault)
.addListener(controlDiv,function () { MapShowCommand(); });
var controlUI = L.DomUtil.create('div','leaflet-control-command-interior',controlDiv);
controlUI.title = 'Map Commands';
return controlDiv;
}
});
var test = new L.Control.Command();
map.addControl(test);
解决方法
您必须在controlDiv中创建一个输入类型=“复选框”的表单元素.
// 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);
在这个jsfiddle http://jsfiddle.net/FranceImage/ao33674e/中工作
你也可以用传单的方式阅读这个提示：https://github.com/Leaflet/Leaflet/blob/master/src/control/Control.Layers.js
