折りたたみパネル(js)

836 ワード
パネルを折り畳むことができます
例をあげる

    

        
Part1

        
 I am part 1

        
Part2

        
I am part 2

        
part 3

        
I am part 3

    

 



$("#accord").on('click','h3',function(e){
    //      
    $(this).next().slideToggle();
    //    next   
})
分析
  • キーは、next方法
    • を理解することである.
  • 及びside Togle方法
  • thisは現在の元素h 3
    • を指します.
  • nextは隣の同じレベルの要素を選択します.ラベルが同じというわけではなく、例えばこの例pとh 3は同じレベルの
    • です.
  • 上記はチェーン操作
    • です.
    そのうち
    $(this).next().slideToggle();
    書き上げてもいいです
    $(this)
    .next()
    .slideToggle();
    参照
    菜鳥教程オンラインエディタjquery next()方法-
    jsonオブジェクトと文字列、配列間の変換