checkbox在div内部,点击div可以切换checkbox的选中状态,但是点击checkbox时没反应?(当checkbox选中时,按钮才能点击。chec
- 当checkbox选中时,按钮才能点击。checkbox没有被选中时,按钮为不能点击的状态,用JS要怎么写onclick
- checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中
- js中多选中单击行能选中,但是单击那个框时不能选中怎么办?
- 有一个问题是:第一次点击全选时不能选中所有的checkbox,之后的click均能执行。望各位大神给予解答~
当checkbox选中时,按钮才能点击。checkbox没有被选中时,按钮为不能点击的状态,用JS要怎么写onclick
<html><br><head><br><title>change BG color</title><br></head><br><script><br>function btnAction(){<br>alert(document.getElementById("xz").disabled);<br><br>alert(2);<br>}<br>function check(){<br> //判断checkbox有没有被选中<br>if(document.getElementById("ch").checked==true)<br>{<br>document.getElementById("xz").disabled="";//给BUTTON按钮的disabled属性赋值<br><br>}else<br>{<br>document.getElementById("xz").disabled="disabled";<br>}<br><br>}<br><br></script><br><body><br><input type="button" value="选择" onclick="btnAction()" id="xz" disabled="disabled"/> <br><input name="check" id="ch" type="checkbox" onclick="check()"/><br></body><br></html>
checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
div
{
display: inline-block;
width: 100px;
margin-left: 10px;
}
</style>
<script src="Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
<script>
//注册checkbox的click事件
$(document).on('click', ':checkbox', function (e) {
//停止事件冒泡,当点击的是checkbox时,就不执行父div的click
e.stopPropagation();
//checkbox选中,div变色,否则不变色
$(this).prop('checked') ?
oCk.parent().css('background-color', 'blue')
: oCk.parent().css('background-color', '');
});
//注册div的click事件,点击div时动态执行checkbox的click事件
$(document).on('click', 'div', function () {
$(this).find(':checkbox').click();
})
</script>
</head>
<body>
<div>
<input type="checkbox" />A
</div>
<div>
<input type="checkbox" />B
</div>
<div>
<input type="checkbox" />C
</div>
</body>
</html>
js中多选中单击行能选中,但是单击那个框时不能选中怎么办?
我也遇到过这种情况,应该是你把checkbox放到了判断行文字是否点击选中的内部了,点击选中文字的div覆盖了checkbox导致多选框无法点击选中,
类似
<li>
<div onclick="选中函数()">
<input type="checkbox" >
</div>
</li>
有一个问题是:第一次点击全选时不能选中所有的checkbox,之后的click均能执行。望各位大神给予解答~
1、你的写法有问题的,$('#selectAll').click事件触发时,你获取到的$('#selectAll').prop('checked')值未必是你要的值,所以你要直接写成true。
2、没有必要监听div1的change事件。
3. 建议这么写:
// 全选
$('#selectAll').click(function(){
$(this).parent().siblings().find('input[type=checkbox]').prop("checked",true);
$('#unselAll').prop('checked',false);
});