2

インターネットでアコーディオンのスクリプトをたくさん見ましたが、私のニーズを満たすものは見つかりませんでした。Facebookが使っているようなアコーディオン用のプラグインを作りたいです。これは次のように機能するはずです。

  1. クリックして開閉します。
  2. 開いている間にスタイルクラスを追加します。
  3. 外側のクリックで閉じます。クリックイベントがアコーディオンボックス内にある場合は閉じないでください。

これを達成する方法はありますか?あなたが知っているなら助けてください。jQueryは初めてです...

前もって感謝します。

4

1 に答える 1

2

15行のコードで解決できる場合は、プラグインは必要ありません。これは、setTimeoutを使用して特定のDOM要素とウィンドウでトリガーされるクリックイベントの順序を変更することです。

var ShowingAccordion = false;

$(document).ready(function () {
    
       $('.MyAccordionOpener').click(function () {
    
             if ($(this).next('.MyAccordion').is(':visible') === false) {

                 ShowingAccordion = false;
                 $('.MyAccordion').hide(500);
                 $(this).next('.MyAccordion').addClass('SomeClass');
                 $(this).next('.MyAccordion').show(500);
                 setTimeout(function () { ShowingAccordion = true; }, 1);
             }
       });
    
       $('.MyAccordion').click(function () {
        
             ShowingAccordion = false;
             //this is the line that solves your problem
             setTimeout(function () { ShowingAccordion = true; }, 1);
       });
        
    
       $(document).click(function () { 
   
           if (ShowingAccordion === true) {     

               $('.MyAccordion').hide(500);
               ShowingAccordion = false;
           }    
       });
});

そして、これがデモです

それがあなたが必要とすることをするなら、あなたは答えと幸せなコーディングを受け入れることができます!

于 2012-05-03T02:28:35.760 に答える