javascript - 更改 jQuery 中当前元素的背景

Question

<label class="default" for="checkbox1"><input id="checkbox1" name="checkbox1" type="checkbox" style="display:none" /> some text</label><br />
<label class="default" for="checkbox2"><input id="checkbox2" name="checkbox2" type="checkbox" style="display:none" /> some text</label><br />
<label class="default" for="checkbox3"><input id="checkbox3" name="checkbox3" type="checkbox" style="display:none" /> some text</label><br />

我应该如何使用 jQuery 更改当前单击的复选框的标签背景颜色？例如，当选中第二个复选框时，应使用“checked”更改其样式:

<label class="checked" for="checkbox2"><input id="checkbox2" name="checkbox2" type="checkbox" style="display:none" /> some text</label><br />

Answer 1

jQuery 中有一个复选框选择器，因此使用它，分配 click 函数以获取父“label”元素并将 css 类切换为“checked”。这将根据复选框的状态添加类和删除类。

$("input:checkbox").click(function() { $(this).parent("label").toggleClass("checked");

另外，如果你这样做的话，你的 css 类名将会更幸运:

<label class="checked" for="checkbox2"><input id="checkbox2" name="checkbox2" type="checkbox" style="display:none" /> some text</label><br />

而不是你上面所做的。 ;)