-1

これについて少し助けが必要です：

HTML
<div id="toggle">
<ul>
    <li class="active"><input type="checkbox" id="test" value="2014" name="test" checked/> 2014</li>
    <div style="display:block;" id="clear-checked">
        <a href="#">January</a><br />
        <a href="#">January</a><br />
        <a href="#">January</a><br />
        <a href="#">January</a><br />
        <a href="#">January</a>
    </div>
    <div class="clear"></div>
    <li><input type="checkbox" id="test" value="2013"  name="test" /> 2013</li>
    <div id="clear-checked">
        <a href="#">January</a><br />
        <a href="#">January</a><br />
        <a href="#">January</a><br />
        <a href="#">January</a><br />
        <a href="#">January</a>
    </div>

</ul>

クリア

JS:

$(document).ready(function() {
    $("li").click(function(){
        $(this).toggleClass("active");
        $(this).next("div").stop('true','true').slideToggle("slow");

         if( $('li').hasClass('active') ) {
             $("#test:checkbox").prop('checked', true);

         } 
         else {

            $("#test:checkbox").prop('checked', false);
        }
    });

 $('#check-all').click(function(){
    $("input:checkbox").attr('checked', true);
});
$('#uncheck-all').click(function(){
$("#test:checkbox").attr('checked', false);
$('#clear-checked').attr("style","display:none;");
$("li").removeClass("active");
});

});

2 番目の div を選択すると、自動的にチェックボックスをオンにする必要がありますが、それは上部の div ではなく div 内にあります。また、クリア リンクでは、2 つの div が認識されないため、チェック ボックスと div は block:none を取得しません。少し助けが必要です、私はたくさん感謝します！ありがとう

ライブデモ: http://fiddle.jshell.net/HsYrD/2/

4

3 に答える 3

1

私もこの種のことは初めてですが、最初の推測では、2 つの異なるチェックボックスに個別の ID が必要だと思います。

于 2013-11-04T23:55:58.390 に答える
0

id="mycheckboxdiv"代わりにandid="mycheckbox"をクラスに変更しました。私は通常、場合によっては重複することが問題を引き起こす可能性が ID'sあることを知っている一意の要素にのみ使用します。ID

whichを利用しthisて、どの要素が変更されたかを追跡することで、変更を正しいmycheckboxdivに適用でき、1 つの関数で実行できます。

$(document).ready(function() {
    $('.mycheckbox').change(function() {
        $(this).parent().next('.mycheckboxdiv').slideToggle(500);
        $(this).parent().find('.disabled').removeClass().addClass('enabled');
    });
});

例

http://fiddle.jshell.net/krF28/1/

于 2013-11-04T23:56:36.360 に答える