微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery 手风琴只能以奇数顺序工作

如何解决jQuery 手风琴只能以奇数顺序工作

我在 WordWress 模板中使用 w3school 的 jQuery 手风琴,同时获取帖子格式,手风琴只能在奇数位置工作,唯一有效的手风琴是第 1、第 3、第 5 等..
这是手风琴的脚本:

<script>
var acc = document.getElementsByClassName("accordion");
var i;

for (i = 0; i < acc.length; i++) {
  acc[i].addEventListener("click",function() {
    this.classList.toggle("active");
    var panel = this.nextElementSibling;
    if (panel.style.maxHeight) {
      panel.style.maxHeight = null;
    } else {
      panel.style.maxHeight = panel.scrollHeight + "px";
    } 
  });
}
</script>

这里是模板的代码

<?PHP $display = roogan_get_episode_layout_options('e'); ?>

<article <?PHP post_class('roogan-item roogan-post section-item-vertical-rhythm roogan-layout-e roogan-is-podcast'); ?>>
    <div class="row justify-content-center">

        <div class="col-12 col-md-6 col-lg-6"> 
            <?PHP if ( $fimg = roogan_get_featured_image( 'roogan-e' ) ): ?>
                <div class="entry-media entry-media-br-6">
                    <a href="<?PHP the_permalink(); ?>"><?PHP echo roogan_wp_kses( $fimg ); ?></a>
                    <?PHP if ( $display['play_icon'] ) : ?>
            <?PHP roogan_play_button( 'roogan-button-play roogan-button-play-white roogan-button-play-large',false ); ?>
                    <?PHP endif; ?>
                </div>
            <?PHP endif; ?>
        </div>

        <div class="col-12 col-md-6 col-lg-6">            
        
            <div class="entry-header">
                
                <?PHP if( $display['category'] ): ?>
                    <div class="entry-category mb--sm"><?PHP echo roogan_get_category(); ?></div>
                <?PHP endif; ?>
                
                <h2 class="entry-title h1"><a href="<?PHP the_permalink(); ?>"><?PHP echo roogan_get_episode_title(); ?></a></h2>

                <?PHP if( $display['Meta'] ): ?>
                    <div class="entry-Meta mt--md">
                        <?PHP echo roogan_get_Meta_data( $display['Meta'] ); ?>
                    </div>
                <?PHP endif; ?>   

            </div>

            <?PHP if( $display['excerpt'] ): ?>
                <div class="entry-content mt--lg">
                    <?PHP echo roogan_get_excerpt( $display['excerpt'] ); ?>
                </div>
            <?PHP endif; ?>

        </div>
        
  </div>
</article>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。