复选框禁用启用
我目前有一个jQuery函数,禁用复选框列表,如果父复选框未选中,并启用它时检查。但是,父复选框默认为取消选中,我想要。复选框禁用启用
这会导致代码出现问题,因为它在页面加载时启用,并且仅在您选中并取消选中父复选框时才会禁用。
任何人都知道一个修复?
$(document).ready(function() {
$('#cbsys').bind('click', function() {
var doEnable = ($('#cbsys:checked').length > 0);
$('#syscbl').each(function() {
if (doEnable) {
$(this).attr('disabled', null);
$(this).parents('label').removeClass('cssDisabled');
} else {
$(this).attr('disabled', 'disabled');
$(this).parents('label').addClass('cssDisabled');
}
});
});
});
只是缓存它作为一个功能和文件准备以及对点击运行它。我还优化你的代码位:
function disableCk() {
var doEnable = $('#cbsys:checked').length; // <-- use a class
$('#syscbl').each(function() { // <-- use a class
var $this = $(this);
if (doEnable) {
$this.prop('disabled', false)
.parents('label')
.removeClass('cssDisabled');
}
else {
$this.prop('disabled', true)
.parents('label')
.addClass('cssDisabled');
}
});
}
$(document).ready(function() {
disableCk();
$('#cbsys').on('click', disableCk);
});
编辑
只注意到你似乎可以用多个ID与无效HTML相同的名称,请务必使用类来代替。我在代码中发表评论,看看上面的内容。
+1 innit !! – 2012-08-07 21:25:43
它们当前是cbl的ID。我应该创建一个类,并将它放在cbl控件和jquery中?我有点新,所以我可能会丢失一些东西,看起来有点不必要 – user1512593 2012-08-07 21:48:30
事情是id必须是唯一的,所以'$(' #syscbl')。'each'对我来说没有任何意义 – elclanrs 2012-08-07 21:51:50
只是触发你的点击处理程序绑定后立即:
$('#cbsys').bind('click', function() {
var doEnable = ($('#cbsys:checked').length > 0);
$('#syscbl').each(function() {
if (doEnable) {
$(this).attr('disabled', null);
$(this).parents('label').removeClass('cssDisabled');
}
else {
$(this).attr('disabled', 'disabled');
$(this).parents('label').addClass('cssDisabled');
}
}).trigger('click').trigger('click');
aaand -1。这将只是“检查”父复选框。 “父复选框默认为取消选中,我想要的。” – ahren 2012-08-07 21:24:36
哈哈,我会删除我编辑的downvote,buuuut仍然有点凌乱。 – ahren 2012-08-07 21:27:10
好点@ahren - 我想通过对现有代码进行微小更改来实现它的方式只是触发点击两次(按照我更新后的答案)......尽管原始代码有点奇怪,但我的意思是$ ('#syscbl')。每个(...'没有意义,并且'doEnable = this.checked'会更好... – nnnnnn 2012-08-07 21:27:12
'$('#syscbl')。each'?一个元素? – undefined 2012-08-07 21:22:40
我认为这些是“Checkboxlist”中的其他复选框...? – MalcolmOcean 2012-08-07 21:28:39