0

我想checkboxes在第一次选中时禁用所有在同一个 div 中的checkbox内容,如果未选中则再次启用。

它为我工作检查here

$('.cdls_content_wrapper input:checkbox:first').click(function () {
    alert('HI');
    $('.cdls_content_wrapper').find(':checkbox').slice(1).each(function () {
        if ($('.cdls_content_wrapper input:checkbox:first').is(':checked')) {
            $(this).attr("disabled", true);
        } else {
            $(this).attr("disabled", false);
        }
    });
});

但问题是当我有另一个相同的 div 并首先单击该 div 时,checkbox它对所有人都做同样的事情。

我想让我的功能更通用,而不是只针对一个 div。

4

5 回答 5

3

尝试

$('.cdls_content_wrapper').find(':checkbox:first').click(function () {
    $(this).closest('.cdls_content_wrapper').find(':checkbox').not(this).attr('disabled', this.checked)
});

演示:小提琴

于 2013-05-17T09:10:23.127 回答
2

您可以添加一个class复选框all并这样做:

$('.cdls_content_wrapper input:checkbox.all').click(function(){
    if($(this).is(':checked')){
        $('input:checkbox',$(this).closest('tr').siblings()).attr("disabled", true);
    }else{
        $('input:checkbox',$(this).closest('tr').siblings()).attr("disabled", false);
    }
});

样品小提琴..

于 2013-05-17T09:29:58.827 回答
0

只需将函数移出处理程序,如下所示:

function DoWork(TheDiv) {

   var IsFirstChecked;

   TheDiv.find(':checkbox').each(function () {

        if (typeof(IsFirstChecked) !== 'boolean') {
              IsFirstChecked = $(this).prop('checked');
         } else {
              $(this).prop('disabled', IsFirstChecked);
         }
    });
}

然后从任何地方调用它:

$('.cdls_content_wrapper').find('input').click(function () {
    DoWork($(this).closest('table'));
});

$('.SomeOtherClass').find('input').click(function () {
    DoWork($(this).closest('table'));
});

这是工作的jsFiddle

此外,根据 jQuery文档,使用.prop()是比使用更好的方法.attr()

于 2013-05-17T09:11:59.280 回答
0

对不起,伙计,我这次成功了!

只需粘贴:

$('.cdls_content_wrapper input:checkbox:first').click(function () {
    alert('HI');
    $(this).parent().parent().parent().find(':checkbox').slice(1).each(function () {
        if ($('.cdls_content_wrapper input:checkbox:first').is(':checked')) {
            $(this).attr("disabled", true);
        } else {
            $(this).attr("disabled", false);
        }
    });
});
于 2013-05-17T09:41:27.090 回答
-1

您必须为两个 div 中的复选框使用不同的类

于 2013-05-17T09:17:18.730 回答