选中/取消选中 jquery 中主复选框时的复选框
Check/Uncheck checkboxes on select of a master checkbox in jquery
我的列标题中有一个复选票。单击它时,需要选中所有复选框,并且在取消选中主复选框时,应取消选中所有复选框。我用谷歌搜索了很多,但我只得到了这种事情的javascript代码。但我想要纯粹的JQuery东西。我在这里粘贴我的代码。现在单击主复选框,所有复选框都在选中,但主复选框本身有人可以帮助我处理 jquery 代码吗?
这是我的标题复选框:
<input type="checkbox" onclick="checkBoxChecked()" id="mastercheck" name ="mastercheck"/>
点击方法是
function checkBoxChecked(){
try{
var checkboxes=document.getElementsByName("test");
for(i=0;i<document.getElementsByName("test").length;i++)
{
checkboxes[i].checked = "checked";
}
}
catch(e)
{
}
document.getElementById("mastercheck").checked="checked";
return true;
}
HTML:
<input type="checkbox" id="ckbCheckAll" />
<p id="checkBoxes">
<input type="checkbox" class="checkBoxClass" id="Checkbox1" />
<br />
<input type="checkbox" class="checkBoxClass" id="Checkbox2" />
<br />
<input type="checkbox" class="checkBoxClass" id="Checkbox3" />
<br />
<input type="checkbox" class="checkBoxClass" id="Checkbox4" />
<br />
<input type="checkbox" class="checkBoxClass" id="Checkbox5" />
<br />
</p>
JQuery:
$(document).ready(function () {
$("#ckbCheckAll").click(function () {
$(".checkBoxClass").prop('checked', $(this).prop('checked'));
});
});
现场演示
$(document).ready(function() {
$("#mastercheck").click(function() {
var checkBoxes = $("input[name=test]");
checkBoxes.prop("checked", this.checked);
});
});
尝试
function checkBoxChecked() {
$('input[name=test]').prop('checked', $('#mastercheck').is(':checked'))
}
选中的属性应设置为 true | false
复选框
[i].check = true;
如果这不起作用,您应该查看以下问题:在破折号中以编程方式更改复选框的状态
你为什么不尝试这样的东西:
$('.master-checkbox').click(function(){
var master_checkbox = $(this);
$('input[type="checkbox"]').prop('checked', master_checkbox.prop('checked'));
});
你可以尝试这样的事情:
$('#mastercheck').on('change', function() {
if ($(this).is(':checked')) {
// Check all
$('.childcheck').prop('checked', true);
}
else {
// Uncheck all
$('.childcheck').prop('checked', false);
}
});
<b> <input type="checkbox" id="ckbCheckAll" /> Check/Uncheck me </b>
<p id="checkBoxes">
<input type="checkbox" class="checkBoxClass" id="Checkbox1" />
<br />
<input type="checkbox" class="checkBoxClass" id="Checkbox2" />
<br />
<input type="checkbox" class="checkBoxClass" id="Checkbox3" />
<br />
<input type="checkbox" class="checkBoxClass" id="Checkbox4" />
<br />
<input type="checkbox" class="checkBoxClass" id="Checkbox5" />
<br />
</p>
$(document).ready(function() {
$('#ckbCheckAll').click(function(){
var isChecked = $('#ckbCheckAll').is(':checked');
if(isChecked)
{
$('.checkBoxClass').attr('checked', true);
}
else
{
$('.checkBoxClass').attr('checked', false);
}
});
});
相关文章:
- 如何选中复选框jquery
- 基于复选框 Jquery 更新文本框
- 复选框组获取选中复选框jquery的值
- 自定义CSS复选框jQuery诱导的“;“已检查”;属性不't在视觉上”;“检查”;复选框
- 多复选框jquery计算
- 如何使用复选框jQuery取消选中并刷新数据
- 选中/取消选中所有子复选框 jquery 引导程序
- 不要禁用选中的复选框 jQuery
- 使用“下拉列表多选复选框”(jquery)创建动态表
- 点击链接时勾选复选框 - jquery
- 轻松限制选中的复选框 jquery UI
- 显示/隐藏嵌套复选框-jQuery
- 使用选中父复选框.jQuery
- 事件处理复选框-jQuery icheck插件
- 多个复选框jquery手动点击复选框触发,但代码点击'一个没有# 39;t
- 复选框jQuery出现意外响应
- 动态地生成/删除文本输入与复选框jQuery
- :空白选择器不工作复选框jQuery Validate()
- 如何对选中的值求和更改复选框jquery
- 复选框jquery或javascript oncheck