Javascript 如果在数组中选中了一个复选框，如何禁用或取消选中所有复选框？

我必须在我的项目中使用一组复选框

我的HTML是这样的：

<label class="checkbox-inline">
  <input type="checkbox" name="hairColor" value="1"> hairColor-1
</label>
<label class="checkbox-inline">
  <input type="checkbox" name="hairColor" value="2"> hairColor-2
</label>
<label class="checkbox-inline">
  <input type="checkbox" name="hairColor" value="3"> hairColor-3
</label>        
<label class="checkbox-inline">
  <input type="checkbox" name="hairColor" value="4" class="any"> any
</label>

<br> 

<label class="checkbox-inline">
  <input type="checkbox" name="eyeColor" value="1"> eyeColor-1
</label>
<label class="checkbox-inline">
  <input type="checkbox" name="eyeColor" value="2"> eyeColor-2
</label>
<label class="checkbox-inline">
  <input type="checkbox" name="eyeColor" value="3"> eyeColor-3
</label>        
<label class="checkbox-inline">
  <input type="checkbox" name="eyeColor" value="4" class="any"> any
</label>

---

这对我有用。但我的问题是，当我将

name

值更改为

array

类型，如

hairColor[]

时，我的代码就不起作用了。

因为您的name属性包含

[]

，您要么需要对它们进行转义，要么像这样切换单引号/双引号用法

$('[name="' + $(this).attr("name") + '"].any')

$（“body”）。在（“更改”，“内联”复选框>输入[type=checkbox]”，函数（）上{
if（$（this）.hasClass（“any”）{//any复选框勾选
如果（$（this.prop（“checked”）{//用户选中了任何
//其他复选框未选中
$（'.checkbox inline>input[type=checkbox][name=“”+$（this）.attr（“name”）+“]：not（.any）”.prop（“checked”，false）
}
}else{//Other复选框勾选
如果（$（this.prop（“checked”）{//用户选中了另一个复选框
//未选中任何复选框
$（'[name=“'+$（this.attr（“name”）+'“].any”）.prop（“选中”，false）；
}
}
});

发色-1
发色-2
发色-3
任何


eyeColor-1
eyeColor-2
eyeColor-3
任何
我喜欢安马尔奇的答案，我投了更高的票，但我相信肯定还有改进的余地。名称属性中可能有其他字符，并且可能有更多的字符实例。因此，我认为一个简单的函数应该可以解决这个问题，如下所示：

function escapeSpecialChars(input) {
     return input.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
}

$( "body" ).on( "change", ".checkbox-inline > input[type=checkbox]", function() {
    var escapedSelector = escapeSpecialChars($(this).attr("name"));
    if ($(this).hasClass("any")) { //Any checkbox tick
        if ($(this).prop("checked")) { //User checked any
            //Other checkboxes are unchecked
            $(".checkbox-inline > input[type=checkbox][name=" + escapedSelector + "]:not(.any)").prop("checked", false)
        }
    } else { //Other checkbox tick
        if ($(this).prop("checked")) {//User checked another checkbox
            //Any checkbox is unchecked
            $("[name=" + escapedSelector + "].any").prop("checked", false);
        }
    }
});

然后你应用它，像这样：

function escapeSpecialChars(input) {
     return input.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
}

$( "body" ).on( "change", ".checkbox-inline > input[type=checkbox]", function() {
    var escapedSelector = escapeSpecialChars($(this).attr("name"));
    if ($(this).hasClass("any")) { //Any checkbox tick
        if ($(this).prop("checked")) { //User checked any
            //Other checkboxes are unchecked
            $(".checkbox-inline > input[type=checkbox][name=" + escapedSelector + "]:not(.any)").prop("checked", false)
        }
    } else { //Other checkbox tick
        if ($(this).prop("checked")) {//User checked another checkbox
            //Any checkbox is unchecked
            $("[name=" + escapedSelector + "].any").prop("checked", false);
        }
    }
});

（
我猜是自动拼写：）cmon Alex，那真的让我大笑起来！对不起，输入错误。。。这是在
数组
类型中摆弄
名称
-