jQuery合上展开动作

全部展开样式

合上如图所示

html代码

<div class="attention_wrap">
<div class="attention_head" onclick="changeDirection('1', this)">
   <div class="attention_title">考前注意事项</div>
   <img class="attention_jiantou" src="./images/up_jt.png" alt="">
</div>
<div class="attention_content">
   内容部分
</div>
</div>

css就省略啦~

js代码

注意：

html代码中的点击事件的第一个参数，有多少个这样的事件，参数就需要从上往下依次增加，因为每个点击事件不能相互影响，这是本人的见解，如果各位大佬有更好的解决方案，欢迎指出，我们共同进步。

                var num1 = 1;
        var num2 = 1;
        var num3 = 1;
        function changeDirection(index, obj) {
            switch (index) {
                case '1':
                    num1++;
                    change(num1, obj)
                    break;
                case '2':
                    num2++;
                    change(num2, obj)
                    break;
                case '3':
                    num3++;
                    change(num3, obj)
                    break;
                default:
                    break;
            }
        }
        function change(mm, obj) {
            $(obj).parent().find(".attention_content").slideToggle();
            if (mm % 2 == 0) {
                $(obj).find('img').removeAttr('src')
                $(obj).find('img').attr('src', 'images/down_jt.png')
            } else {
                $(obj).find('img').removeAttr('src')
                $(obj).find('img').attr('src', 'images/up_jt.png')
            }
        }

新改

$('.attention_head').on('click', function(){
            console.log($(this))
            $(this).parent().find('.attention_content').slideToggle();
            var imgSrc = $(this).find('img').attr('src');
            if(imgSrc == './images/up_jt.png'){
                $(this).find('img').removeAttr('src');
                $(this).find('img').attr('src','./images/down_jt.png')
            }else{
                $(this).find('img').removeAttr('src');
                $(this).find('img').attr('src','./images/up_jt.png')
            }
        })