-2

車のメーカーのリストがあります... 全部で約 70 です。ユーザーがクリックすると、あらかじめ決められた車のメーカーを自動的にチェックする一連のボタンを上部に配置したいと思います。たとえば、ユーザーが [インポート] ボタンを選択すると、Acura、Honda、Hyundai、Kia、Mazda、Mitsubishi、Nissan、Scion、Subaru、Suzuki、Toyota、および VW のチェックボックスが自動的に選択されます。

ここで誰かが私を正しい方向に向けることができますか?

4

3 に答える 3

1

お楽しみください: 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"));
        });
    });

});
于 2012-06-27T14:45:38.080 に答える
1

グループごとに個別の CSS クラスを作成し、それらのクラスを適切な要素に割り当てます。

次に、対応するボタンが押されたときに、チェックボックスにchecked属性を設定します。

各ボタンのクラスtype-buttonsと ID 属性が目的のtypeに設定されていると仮定しますid="imports"

$('.type-buttons').click(function(){
    var type = $(this).attr('id');
    $('input:checkbox.' + type).attr('checked','checked'); 
});
于 2012-06-27T14:29:46.143 に答える
1

選択したいチェックボックスにクラスを追加し、そのクラスを使用して、ユーザーがボタンをクリックしたときにそれらをチェックします。何かのようなもの:

$('.defaultOnAcura').attr('checked', 'true');
于 2012-06-27T14:29:50.197 に答える