将带有 jquery 的复选框添加到 div 中答案

【问题标题】：Add a checkbox with jquery into a div将带有 jquery 的复选框添加到 div 中
【发布时间】：2012-10-23 17:30:04
【问题描述】：

我想在一个 div 中添加一个复选框到另一个 div 中（id="#sensorList"），然后将一些事件处理程序绑定到它。我是这样做的

/* Add div */
$("#sensorList").append($('<div>', { id : sensorId})
.addClass("sensorListItem")
.text(sensorId)
);

/* Adds visibile checkbox */
$("#"+sensorId).append($('<input>', { id : sensorId + "VisibleCheckbox", type:"checkbox", name: sensorId + "VisibleCheckbox"}));

它似乎工作正常，但如果我点击复选框，它不会切换到检查状态！

有什么想法吗？提前谢谢你。

对不起，我知道问题出在哪里了。我无法看到选中的复选框，因为我在 div 上有一个名为 sensorId 的点击处理程序，我愚蠢地做了：event.preventDefault()（点击 div 时没有默认行为！！！）

【问题讨论】：

您确定没有任何其他代码阻止复选框的默认操作，或者您只是在其上放置了另一个元素。

标签： javascript jquery html checkbox

【解决方案1】：

尝试一些长手，看看它是否有效......

$("#"+sensorId).append('<input type="checkbox" id="' + sensorId + 'VisibleCheckbox" name="'  + sensorId + 'VisibleCheckbox" >');

【讨论】：

【解决方案2】：

它对我有用。查看 jsfiddle：http://jsfiddle.net/pVjNM/

var sensorId = "one";

/* Add div */
$("#sensorList").append($('<div>', { id : sensorId })
.addClass("sensorListItem")
.text(sensorId)
);

/* Adds visibile checkbox */
$("#"+sensorId).append($('<input>', { id : sensorId + "VisibleCheckbox", type:"checkbox", name: sensorId + "VisibleCheckbox"}));

$("input[type=checkbox]").each(function(){
    this.click();
    console.log("Should be true:", this.checked);
});


$("input[type=checkbox]").each(function(){
    this.click();
    console.log("Should be false:", this.checked);
});

【讨论】：