お楽しみください: http://jsfiddle.net/v9p5C/
トグル ボタンには、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"));
});
});
});