1

jQuery を使用して、すべてのチェック ボックスとラジオ ボタンを非表示にし、CSSbackgroundを使用してテーマの状態を示します。ラジオ ボタンですべてのチェック ボックスをオフにしたいのですが、CSS が変更されてもチェック ボックスがオンのままであるため、実装が機能しません。

 var fliter_radio=$(".item input[name='group1_radio']");
 var fliter_checkbox=$(".item input[name='group1']");

 fliter_radio.next().click(function(){
                          $(this).prev()[0].checked=true; 
                          $(this).addClass("checked");

                          //#unchecked all checkbox
                          fliter_checkbox.each(function(){
                                 $(this).checked=false;
                                 $(this).next().removeClass("checked"); 
                          })
  })

<li class="item"><input type="radio" id="radio" name="group1_radio" checked="checked" value="unchecked" /><strong>radio button</strong></li>
<li class="item"><input type="checkbox" id="CheckBox1" name="group1" value="news" /><strong>Checkbox1</strong></li>
<li class="item"><input type="checkbox" id="CheckBox2" name="group1" value="news" /><strong>Checkbox2</strong></li>

ここで完全なデモを書き直します: http://jsfiddle.net/badjohnny/MnujS/8/

これを正しく実装するのを手伝ってもらえますか?

4

2 に答える 2

3

$(this).checked=false;に$(this).prop("checked",false);

于 2012-05-31T05:14:30.773 に答える
1 
$(document).ready(function() {
    function custom_uncheck(radio, checkbox) {
        var fliter_checkbox = $(checkbox);
        var fliter_radio = $(radio);

        fliter_checkbox.hide();
        fliter_radio.hide();

        fliter_radio.next().on('click', function() {

            $(this).addClass('checked')  // add checked class to strong
                  .prev().prop('checked', true); // make check the radio

            fliter_checkbox.prop('checked', false)   // make checkbox uncheck
                   .next('strong').removeClass('checked');  // remove checked class

        }).click();  // trigger the initial click

        fliter_checkbox.next('strong').on('click', function() {// click on checkbox
            $(this).toggleClass('checked')  // changing checked class
                  .prev()  // go to checkbox
                  .prop('checked', function() { // change checkbox check status
                                return !this.checked;
                           });
            // make uncheck the radio and remove checked class from strong
            fliter_radio.prop('checked', false).next().removeClass('checked');
        });
    }
    custom_uncheck('input[name="all"]', 'input[name="c"]');
})​;

作業サンプル

于 2012-05-31T05:17:17.893 に答える