1

アコーディオンメニューが機能するようにするこのJavaScriptコードがあります、それは機能します、ちょっと...リンクをクリックすると、実際に本来のようにドロップダウンしますが、もう一度クリックすると、元に戻り、再びダウンします、私が望むように隠れていません。開いたばかりの要素を非表示にする唯一の方法は、メニューの次の要素をクリックすることです。次に、最初の要素が閉じ、2番目の要素が開きます。これを変更して、開いた要素を閉じて閉じたままにすることができます。閉じてすぐに開くのではなく。

コード：

// JavaScript Document
$(document).ready(function() {

    //ACCORDION BUTTON ACTION   
    $('div.accordionButton').click(function() {
        $('div.accordionContent').slideUp('normal');    
        $(this).next().slideDown('normal');
    });

    //HIDE THE DIVS ON PAGE LOAD    
    $("div.accordionContent").hide();

});

  <div id="wrapper">
     <div class="accordionButton"><strong>Subject:</strong></div>
    <div class="accordionContent">Text</div>
     <div class="accordionButton"><strong>Subject:</strong></div>
    <div class="accordionContent">Text</div>
     <div class="accordionButton"><strong>Subject:</strong></div>
    <div class="accordionContent">Text</div>        
</div>
4

2 に答える 2

1

変化する：

$('div.accordionContent').slideUp('normal');
$(this).next().slideDown('normal');

することが

$('div.accordionContent').not($(this).next()).slideUp('normal');
$(this).next().slideToggle();
于 2013-02-03T23:09:45.313 に答える
0

イベントのバブリングの問題である可能性がありますが、完全なコードがなければ、何とも言えません。クリック リスナーの最後に「return false」を含めて、バブリングを停止し、デフォルトの動作が実行されないようにすることもできます。

于 2013-02-03T23:11:18.150 に答える