首页 > 解决方案 > 使用带有 Wordpress ACF 转发器字段的 Bootstrap Accordion

问题描述

我正在使用带有 ACF 的 Bootstrap Accordion,并且在转发器部分有一个转发器。我得到了所有数据,它按原样显示,但是当我单击标题打开正文时,类更改为“折叠显示”,手风琴打开了几分之一秒,然后立即再次关闭。有没有人有任何想法?这是代码:

<div id="accordion">
                <div class="card">
                <?php 
                if( have_rows('instructions_android')):
                    $i = 1;

                    while ( have_rows('instructions_android')) : the_row();

                ?>
                    <div class="card-header" id="heading<?php echo $i; ?>">
                        <h5 class="mb-0">
                            <button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapse<?php echo $i; ?>" aria-expanded="false" aria-controls="collapse<?php echo $i; ?>">
                            <span class="instr-title"><?php echo get_sub_field('etape_installation_no'); ?> : </span><span class="instr-title"><?php echo get_sub_field('titre_du_step'); ?></span>
                            </button>
                        </h5>
                    </div>

                    <div id="collapse<?php echo $i; ?>" class="collapse" aria-labelledby="heading<?php echo $i; ?>" data-parent="#accordion">
                    <?php
                $i++;?>
                    <div class="card-body">
                            <ul>
                                    <?php 
                                    $j = 1;
                                    if( have_rows('descr_step')):

                                        while ( have_rows('descr_step')) : the_row();
                                        ?>
                                        <li><?php echo get_sub_field('description'); ?></li>
                                    <?php 
                                            $j++;
                                        endwhile; ?>
                            </ul>
            <?php endif; ?>      
                        </div><!--card body-->
                    </div>
                </div><!--card-->

           <?php endwhile;
            endif;?>
            </div>

标签: wordpressadvanced-custom-fieldsbootstrap-accordion

解决方案


推荐阅读