“活动”类不起作用

时间:2018-03-13 12:28:28

标签: javascript php jquery wordpress

在我的项目中,我使用的是手风琴,但“活动”状态仅适用于点击事件。我需要它在活动时工作。激活时,它会在未激活时显示减号和加号。我在Wordpress中使用ACF。

我的PHP代码:

<div class="accordian-boxed"><br>

<?php if(get_field('bio_bl2_accordion')): 
$dig_count=0; ?>

<ul class="accordion-box">

    <?php while(has_sub_field('bio_bl2_accordion')): 
    if ($dig_count == 0) { ?>

    <li class="accordion block">
        <div class="acc-btn">
            <div class="icon-outer">
                <span class="icon icon-plus fa fa-plus"></span>
                <span class="icon icon-minus fa fa-minus"></span>
            </div>
            <?php the_sub_field('ac_titulo');?>
        </div>
        <div class="acc-content current">
            <div class="content">
                <div class="text">
                    <p><?php the_sub_field('ac_descricao');?></p>
                </div>
            </div>
        </div>
    </li>

        <?php } else {?>

    <li class="accordion block">
        <div class="acc-btn">
            <div class="icon-outer">
                <span class="icon icon-plus fa fa-plus"></span>
                <span class="icon icon-minus fa fa-minus"></span>
            </div>
            <?php the_sub_field('ac_titulo');?>
        </div>
        <div class="acc-content">
            <div class="content">
                <div class="text">
                    <p><?php the_sub_field('ac_descricao');?></p>
                </div>
            </div>
        </div>
    </li>    

    <?php } 
        $dig_count++; ?>    
        <?php endwhile; ?>

</ul>

<?php else : endif; ?>

我的JS代码:

if($('.accordion-box').length){
    $('.accordion-box').on('click', '.acc-btn', function() {

        var target = $(this).parents('.accordion');

        if($(this).hasClass('active')!==true){
            $('.accordion .acc-btn').removeClass('active');
        }

        if ($(this).next('.acc-content').is(':visible')){
            //$(this).removeClass('active');
            return false;
            //$(this).next('.accord-content').slideUp(300);
        }else{
            $(this).addClass('active');
            $('.accordion').removeClass('active-block');
            $('.accordion .acc-content').slideUp(300);
            target.addClass('active-block');
            $(this).next('.acc-content').slideDown(300);    
        }
    });
}

见图片:

7.7

有人可以帮助我吗?

由于

0 个答案:

没有答案
相关问题