当前位置:  开发笔记 > 编程语言 > 正文

如何取消选中除使用jQuery之外的所有复选框?

如何解决《如何取消选中除使用jQuery之外的所有复选框?》经验,为你挑选了1个好方法。

我有一个包含多个复选框组的表单.

每个复选框选项都有一个名为的自定义html 5属性itemtype.当type ="checkbox"的输入发生变化时,我需要评估刚刚选中的复选框.如果它的data-itemtype值等于'Skipper',我想取消选中属于同一组的所有其他复选框.

换句话说,假设我有多个复选框,其中一个复选框选项有一个名为"None"的标签,如果用户选中"None",则应该选择Nothing但是"None".我不能在这里使用单选按钮,因为如果没有选择"无",我希望用户能够检查多个选项.

这是我的代码细分

CHECKBOX GROUP 1

 Zulauf Ltd
Ziemann, McLaughlin and Kohler None

CHECKBOX GROUP 2

 First Options
Some other option None

我创建了一个小提琴,告诉你我做了什么以及整个表格https://jsfiddle.net/8yf0v3xt/13/

我试图做这样的事情,但是没有用

$(:checkbox).change(function(){
        var skipper = $("input:checkbox[data-itemtype='Skipper']");

        if( skipper.is(":checked")){

            $(this).attr('checked', false); //uncheck all the boxes for the current group

            skipper.attr('checked', true); //re-check the box that caused everything to uncheck

        }
}).change();

如果选择"无",我该怎么做才能解除所有选项?



1> Hemal..:

希望这对你有用

$(:checkbox).change(function(){
        var skipper = $("input:checkbox[data-itemtype='Skipper']");

    if( skipper.is(":checked")){

        //$(":checkbox").attr('checked', false); //uncheck all the boxes for the current group

        //skipper.attr('checked', true); //re-check the box that caused everything to uncheck

        $(":checkbox").not(skipper).prop("checked",false);//THIS IS IMPORTANT

    }
}).change();

UPDATE

工作时尚

更新2

工作时间2

 $(:checkbox).change(function(){
    var skipper = $("input:checkbox[data-itemtype='Skipper']");

if( skipper.is(":checked")){

    //$(":checkbox").attr('checked', false); //uncheck all the boxes for the current group

    //skipper.attr('checked', true); //re-check the box that caused everything to uncheck

    //$(":checkbox").not(skipper).prop("checked",false);//THIS IS IMPORTANT
    //THIS IS IMPORTANT
    $(this).closest(".survey-control-fieldset").find(":checkbox").not(skipper).prop("checked",false);

}
}).change();

更新3

工作时间3

$(:checkbox).change(function(){
        var skipper = $("input:checkbox[data-itemtype='Skipper']");

    if( skipper.is(":checked")){

        //$(":checkbox").attr('checked', false); //uncheck all the boxes for the current group

        //skipper.attr('checked', true); //re-check the box that caused everything to uncheck

        //$(":checkbox").not(skipper).prop("checked",false);//THIS IS IMPORTANT
        //THIS IS IMPORTANT
        $(this).closest(".survey-control-fieldset").find(":checkbox").not(skipper).prop("checked",false);

    }
    else
        {
            $(this).closest(".survey-control-fieldset").find(":checkbox[data-itemtype='Skipper']").prop("checked",false);
        }
    }).change();

结论

我注意到你的代码错误的几点如下.

    您正在使用$(this).attr("checked",false);取消选中所有错误的复选框.$(this)仅指向CURRENT SINGLE ELEMENT,而不是全部.

    您使用.attr("checked",false)的也是不正确的,它应该是.attr("checked","checked")或者 .prop("checked",true).

推荐阅读
帆侮听我悄悄说星星
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有