为用户选择某些复选框的按钮答案

【问题标题】：Button to select certain checkboxes for user为用户选择某些复选框的按钮
【发布时间】：2012-06-29 00:28:47
【问题描述】：

我有一个汽车制造商的清单......总共大约 70 个。我想在顶部有一组按钮，当用户单击它们时，会自动检查为它们制造的预定汽车。因此，例如，当用户选择“进口”按钮时，讴歌、本田、现代、起亚、马自达、三菱、日产、Scion、斯巴鲁、铃木、丰田和大众的复选框会被自动选中。

有人可以在这里指出正确的方向吗？

【问题讨论】：

我无法在网上找到任何与我正在寻找的东西相近的东西。我发现的唯一一件事是选择表单中的所有复选框......而不是基于它们的值的单个复选框。
可能重复：one、two、three,..和many more。

标签： jquery html forms checkbox

【解决方案1】：

为每个组创建一个单独的 CSS 类并将这些类分配给适当的元素。

然后当相应的按钮被按下时，设置复选框的选中属性。

假设每个按钮都有 type-buttons 类和 ID 属性设置为所需的 type，即 id="imports"。

$('.type-buttons').click(function(){
    var type = $(this).attr('id');
    $('input:checkbox.' + type).attr('checked','checked'); 
});

【讨论】：

【解决方案2】：

在您想要选中的复选框中添加一个类，然后在用户单击按钮时使用该类来检查它们。比如：

$('.defaultOnAcura').attr('checked', 'true');

【讨论】：

【解决方案3】：

享受：http://jsfiddle.net/v9p5C/

Toggler 按钮有一个data-filter 属性，用于指定要切换的内容：

<input type="button" data-filter='us' value="USA"><br>
<input type="button" data-filter='jp' value="Japanese"><br>
<input type="button" data-filter='de' value="German"><br>
<input type="button" data-filter='import' value="Import"><br>

复选框有一个data-tags 属性，它是一个 JSON 标签数组：

<input type="checkbox" data-tags='["us"]'>Cadillac<br>
<input type="checkbox" data-tags='["jp","import"]'>Mazda<br>
<input type="checkbox" data-tags='["de","import"]'>VW<br>
<input type="checkbox" data-tags='["hu","import"]'>Rába<br>

最后是一些 jQuery 让它工作：

$(document).on('click','input[type="button"]',function(e){

    var filter = $(this).data('filter');

    $('input[type="checkbox"]').each(function(){
        var $checkbox = $(this);
        var tags = $checkbox.data('tags');
        $.each( tags, function(){
            if( filter == this ) $checkbox.prop("checked", !$checkbox.prop("checked"));
        });
    });

});

【讨论】：

当然，你可以把这些标签放到类名中，这样可以大大简化过滤部分，但是我无法抗拒JSON的方式。
我已经尝试了大约一个小时来实现这一点，但我无法得到它。我已经尝试从您发布的链接中获取所有 js 脚本并包括它们，但它仍然无法正常工作。有什么想法吗？
什么不起作用？有一件事可能很棘手，将 json 数组正确引用为属性（单/双引号），但您可以将它们替换为单个空格分隔的列表并使用 jQuery 的 api.jquery.com/attribute-contains-word-selector 。