使用jQuery将复选框添加到一个div中。

Question

我想在另一个带有id="#sensorList"的div中添加一个复选框，并绑定一些事件处理程序。 我是这样做的

/* 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"}));

似乎一切正常，但如果我点击复选框，它不会切换到选中状态！有任何想法吗？提前感谢您。

---

非常抱歉，我找到了问题所在。我无法看到复选框被选中，因为我在名为sensorId的div上有一个点击处理程序，并且我愚蠢地执行了：event.preventDefault()（点击div没有默认行为！）

- dar0x

---

你确定没有其他代码阻止了复选框的默认操作，或者你只是将另一个元素放在其上方吗？ - adeneo

Answer 1

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

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

- kingkode

Answer 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);
});​

- Phu