我需要将所有选中的复选框涂成绿色,将未选中的复选框涂成红色。
<style>
input[type=checkbox]+span{
color:red;
}
input[type=checkbox][checked]+span{
color:green;
}
</style>
<label>
<input type="checkbox" class="bike"/>
<span>I have a bike</span></label>
<label>
<input type="checkbox" checked class="car"/>
<span>I have a car</span>
</label>
加载页面时看起来不错。但是后来,当用户单击任何复选框时,它们的颜色都没有改变。经过调试,我知道checked
当用户单击发生时,属性没有添加到输入标签中。有人可以告诉我原因吗?
我试图checked
明确地放置属性,然后效果很好。
<button>Click</button>
<script>
$('button').click(function(){
$('.bike').attr('checked',true);
});
</script>
但我不想使用任何脚本来实现这一点。有没有办法让它成为可能?
实际上何时将checked
属性添加到复选框以使其选中?这是jsfiddle。