jQueryアコーディオンがすぐに開きます。

Question

アコーディオンメニューを持つサイトのjQueryコードをいくつか変更しました。それがもう一度クリックされるまで

$(function() { 
    function close_accordion_section() { 
     $('.accordion-section-title').removeClass('active'); 
     $('.accordion-section-content').slideUp(300).removeClass('open'); 
    } 

    $('.accordion-section-title').click(function(e) { 
     // Grab current anchor value 
     var currentAttrValue = $(this).attr('href'); 
     console.log(currentAttrValue); 

     if($(e.target).is('.active')) { 
      close_accordion_section(); 
     } else { 

      // Add active class to section title 
      $(this).addClass('active'); 
      // Open up the hidden content panel 
      $(currentAttrValue).slideDown(300).addClass('open'); 
     } 

     e.preventDefault(); 
    }); 
}); 

アコーディオンは開いたままにする必要がありますが、それは伸縮性のあるひもにつないだようないくつかの理由でそれは少し、開封後すぐに閉じています。

アコーディオンがユーザーがクリックしたときにのみ閉じるのが好きです。私は以下の.html.erbファイルを再現しました。

<div class="copytext text-box col-5"> 

    <h2>Optimisation, Forecasting, Sales and Marketing Alignment</h2> 

    <div class="accordion-section"> 
    <a class="accordion-section-title" href="#optimisation-accordbar">Optimisation</a> 

    <div id="optimisation-accordbar" class="accordion-section-content"> 
     <p>In short, optimisation is getting the best out of what you have.</p> 
    </div> 
    </div> 

    <div class="accordion-section"> 
    <a class="accordion-section-title" href="#margin-improvement-accordbar">Margin Improvement</a> 

    <div id="margin-improvement-accordbar" class="accordion-section-content"> 
     <p>Margin improvement is about making more profit by improving what you already do.</p> 
    </div> 
    </div> 

    <div class="accordion-section"> 
    <a class="accordion-section-title" href="#forecasting-accordbar">Forecasting</a> 

    <div id="forecasting-accordbar" class="accordion-section-content"> 
     <p>Forecasting is the act of getting the sales team to stop producing works of fantasy and produce figures which production believe enough to manufacture to.</p> 
     <p>Aligning sales and marketing is ensuring that marketing activities are such that they drive the sales team towards their turnover targets but now, so that they drive the sales team to sell the products which make the company the greatest profit based on the mix of products they sell.</p> 
     <p>We can address all of these areas without telling you about some new specialized piece of machinery would reduce faults, 
    make things faster and replace 5 shop floor operatives.</p> 
     <p>In fact, our optimisation models often show that the introduction of an expensive but appropriate piece of automated production will indeed increase the profits as expected, but it often shows up the rather than dismissing the now unwanted labour, the firm can make even greater profits by redeploying them.<p/> 
     <p>A sales plan or manufacturing plan or an investment justification plan cannot show the interactions which Linear Programming Optimisation can, 
     and often to the shock of the accountants, a labour cost can be a large profit improvement if deployed wisely and modeled correctly.</p> 
    </div> 
    </div> 
</div> 

SCSSが続きます。

/* Transitions */ 

.accordion, .accordion * { 
    -webkit-box-sizing:border-box; 
    -moz-box-sizing:border-box; 
    box-sizing:border-box; 
} 

.accordion { 
    cursor: pointer; 
    overflow:hidden; 
    box-shadow:0px 1px 3px rgba(0,0,0,0.25); 
    border-radius:3px; 
    background:#f7f7f7; 
} 

.accordion-section-title { 
    width:100%; 
    padding:15px; 
    display:inline-block; 
    background:#eee; 
    @include default-border; 
    transition:all linear 0.15s; 
    font-size:1.200em; 
    text-shadow:1px 1px 0px #555; 
    text-decoration: none; 
} 

.accordion-section-title.active, .accordion-section-title:hover { 
    background:#4c4c4c; 
    text-decoration:none; 
} 

.accordion-section-content { 
    padding:15px; 
    display:none; 
} 

誰も私は、ユーザーが再びそれをクリックするまで開いたままにアコーディオンを取得するために起こっているとどのように何うまく助けることができるならば、私は様々なデバッグ手順およびIを進めてきたように、私は非常に感謝されますまだ間違っていることを解決することはできません。

Answer 1

あなたの問題は、同じことを2回行うことに関連しているようです。 jQuery以外のライブラリをロードせずに、コードがwork fineのように見えますが、複数のライブラリが開いていて、それらのライブラリを閉じようとすると、現在のライブラリではなくすべてのライブラリが誤ってクローズされます。

あなたの要素で使用するclassに既にオープン/クローズ機能を提供する他のスクリプト/ライブラリ（おそらくjQuery-ui？）を読み込んでいます。したがって、2つのオプションがあります：

1. 現在使用しているライブラリの現在のオープン/クローズ機能でロールする - これはあなたの現在のカスタムアニメーションをあきらめることを意味します。
2. カスタムアニメーションでロールしますが、別のクラス名を使用するため、ライブラリは開いたり閉じたりしません。