0

私の心を揺さぶるこの問題があります。アコーディオングループ内にチェックボックスがあります。私の手順は、アコーディオングループ内のチェックボックスを押すと、そのアコーディオングループの本体が展開され、show()別のボタンが別の場所に展開されます。

問題は、2 つのチェックボックスを押すと、ボタンの表示と非表示が非常に速くなることです。私の仮定は、クリックイベントがどこかで泡立ち、そこでそれをつかんで完全に黙らせることができないということです!

私のHTML

<div class="accordion span5" id="info-accordion">
    <div class="accordion-group" data-pid="71" data-pweight="2">
        <div class="accordion-heading">
            <input type="checkbox" class="tier-check" value="17">
            <a class="accordion-toggle" data-toggle="collapse" href="#collapse-17">2013-07-10 14:21:03</a>
        </div>
        <div id="collapse-17" class="accordion-body in collapse" style="height: auto;">
            <div class="accordion-inner">Naware is a village in the Bassar Prefecture in the Kara Region of north-western Togo. and add some more content. This is the old one. should show in the info now. To be save really.

            This text should be improved.
            </div>
        </div>
    </div>
    <div class="accordion-group" data-pid="71" data-pweight="2">
        <div class="accordion-heading">
            <input type="checkbox" class="tier-check" value="21">
                <a class="accordion-toggle" data-toggle="collapse" href="#collapse-21">2013-07-10 14:20:39</a>
        </div>
        <div id="collapse-21" class="accordion-body in collapse" style="height: auto;">
            <div class="accordion-inner">Naware is a village in the Bassar Prefecture in the Kara Region of north-western Togo. and add some more content. This is the old one. should show in the info now. To be save really.

            This text should be improved.


            This is new text
            </div>
        </div>
    </div>
    <div class="accordion-group" data-pid="71" data-pweight="2">
        <div class="accordion-heading">
            <input type="checkbox" class="tier-check" value="18">
            <a class="accordion-toggle" data-toggle="collapse" href="#collapse-18">2013-07-10 14:07:53</a>
        </div>
        <div id="collapse-18" class="accordion-body in collapse" style="height: auto;">
            <div class="accordion-inner">Naware is no more
            </div>
        </div>
    </div>
</div>

そして私のjavascriptは

//hide them all
var orgchk = $('.tier-check:checkbox').not(':checked');

orgchk.each(function(i) { 
    $(this).removeAttr('disabled');

    var cllps = $('#collapse-' + $(this).val() ); 
    if ( cllps.hasClass('in') );
            cllps.collapse('toggle');
});

//when only one checkbox is selected, show it
var chkbx = $('.tier-check:checkbox:checked');
$('#collapse-' + chkbx.val() ).collapse('show');

if ( chkbx.length != 0 )
         $tier_btn.fadeIn();
else
         $tier_btn.fadeOut();

ここにフィドルがありますhttp://jsfiddle.net/nuE2c/まだ私の場合に合わせて調整しています

4

1 に答える 1

0

これを使用して解決策を見つけました。jQuery stopPropogation() および StopImmediatePropagation() が機能しなかった場合、イベントの伝播が停止するようです

$('#accordion').on('hidden',function(e) {
            return false;//stopping propagation
    });
于 2013-07-11T03:19:15.217 に答える