Jquery手风琴附加要求

Question

我在以下jquery代码中需要两个修正案。 (DEMO is here)

1. 当我点击para。
中的关闭链接时，我想向上滑动（隐藏）该段落
2. 当我向上/向下滑动任何段落时，活动类（箭头图标）应该可以正常工作。如果你注意到，当我打开两个段落时，箭头方向变得疯狂（∧向上，∨向下，∧向上）。当para关闭时箭头指针应向下（∨），如果打开箭头应指向向上（∧）。

以下是我的代码

$(document).ready(function(){
    $(".accordion p").hide();

    $(".accordion h3").click(function(){
        $(this).next("p").slideToggle("fast")
        $(this).toggleClass("active");
        $(this).siblings("h3").removeClass("active");
    });
});

先谢谢

Answer 1

如果您想要打开多个段落，这可能会有所帮助。

$(document).ready(function(){
    $(".accordion p").hide();

    $(".accordion h3").click(function(){
        $(this).next("p").slideToggle("fast")
        $(this).toggleClass("active");
    });

    $(".mylink").click(function(){
        $(this).parent('p').prev().trigger('click');
    });
});

检查fiddle是否有演示。

Answer 2

通过更多的工作，我相信你很快就会自己做到这一点！

的 LIVE DEMO

$(function(){
    $(".accordion p").hide();

    $(".accordion h3").click(function(){
        $(this).next("p").slideToggle("fast").siblings('p').slideUp("fast");
        $(this).toggleClass("active").siblings("h3").removeClass("active");            
    });

    $('.accordion a.mylink').click(function( e ){
        e.preventDefault();
        $(this).closest('p').slideToggle("fast").prev('h3').removeClass("active");        
    });
});