javascript - 如果选择了其他复选框，则取消选中复选框

Question

就目前情况而言，这个问题不太适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持，但这个问题可能会引发辩论、争论、民意调查或扩展讨论。如果您觉得这个问题可以改进并可能重新开放， visit the help center以获得指导。

已关闭 11 年前。

我有很多城市输入复选框。我将第一个复选框命名为全部；如果用户选择，则仅选择全部复选框，而不选择其他城市复选框。

如果用户选中任何其他城市，则应自动取消选中全部复选框。我想使用 JavaScript 或 jQuery 来完成此操作。

<input type="checkbox" name="city_pref[]" id="city_all" value="0" checked /><label for="city_all">All</label>
<input type="checkbox" name="city_pref[]" id="city_pref_1" value="Chicago" /><label for="city_pref_1">Chicago</label>
<input type="checkbox" name="city_pref[]" id="city_pref_2" value="Texas" /><label for="city_pref_2">Texas</label>

等等......

Answer 1

试试这个

​$(function(){
    var el=$('input:checkbox[name="city_pref[]"]');
    el.on('change', function(e){
        if($(this).is(':checked')) el.not($(this)).prop('checked', false);
    });
});​

DEMO.

更新:(澄清问题后)

$(function(){
    var el=$('input:checkbox[name="city_pref[]"]');
    el.on('change', function(e){
        if($(this).attr('id')!='city_all')
        {
            if($(this).is(':checked')) $('#city_all').prop('checked', false);
        }
        else
        {
            if($(this).is(':checked')) el.not($(this)).prop('checked', false);
        }
    });
});​

DEMO.

更新:(2012年7月23日)

我想要该功能，当未选中任何复选框时，所有内容都会自动选中

Updated Demo.