Question

您好我基本上创建了一个帮助页面，其中有一个使用转发器字段创建的动态列表。

每个列表项都有一行文本，单击时应显示更多内容（并在再次单击时隐藏它）。

现在我可以让它为列表中的第一个项目工作......但每个新项目只显示/隐藏第一个项目。

我假设我需要为每个人做一些我或者我不知道如何做的事情。

Thx的任何帮助，这里是代码：

<?php if (have_rows('video_felt')): ?>
        <ul>
            <?php while (have_rows ('video_felt')): the_row();
            //vars
            $afsnitOverskrift = get_sub_field('afsnit_titel');
            ?>
                <li>
                    <?php if($afsnitOverskrift): ?>
                         <?php echo $afsnitOverskrift; ?>
                    <?php endif;?>

                </li>
                    <?php if (have_rows('video_liste')): ?>    
                        <ul>
                            <?php while (have_rows ('video_liste')): the_row();
                            //vars
                            $videListe = get_sub_field('video_navn');
                            $videoLinker = get_sub_field('vide_link');?>
                            <li onclick="myFunction()">
                                <?php if($videListe): ?>
                                    <a  ><?php echo $videListe; ?></a> 
                                    <div id="myDIV" style="display:none;">
                                        <div class="youtube-player" data-id="<?php echo $videoLinker;?>"></div>

                                    </div>   
                                <?php endif;?>
                            </li>
                            <?php endwhile;?>
                        </ul>
                    <?php endif;?>
            <?php endwhile; ?>
        </ul>
        <?php endif;?>
<script>
function myFunction() {
    var x = document.getElementById("myDIV");
    if (x.style.display === "block") {
        x.style.display = "none";
    } else {
        x.style.display = "block";
    }
}
</script>

Answer 1

我只需用jquery编辑你的代码，请检查下面的工作代码。

<?php if (have_rows('video_felt')): ?>
    <ul class="videoul">
        <?php while (have_rows ('video_felt')): the_row();
        //vars
        $afsnitOverskrift = get_sub_field('afsnit_titel');
        ?>
            <li>
                <?php if($afsnitOverskrift): ?>
                     <?php echo $afsnitOverskrift; ?>
                <?php endif;?>

            </li>
                <?php if (have_rows('video_liste')): ?>    
                    <ul>
                        <?php while (have_rows ('video_liste')): the_row();
                        //vars
                        $videListe = get_sub_field('video_navn');
                        $videoLinker = get_sub_field('vide_link');?>
                        <li >
                            <?php if($videListe): ?>
                                <a  ><?php echo $videListe; ?></a> 
                                <div class="myDIV" style="display:none;">
                                    <div class="youtube-player" data-id="<?php echo $videoLinker;?>"></div>

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

<强>的jQuery

    <script>
      jQuery(document).ready(function(){

        jQuery('body').on('click', 'ul.videoul li', function() {
           jQuery("div.myDIV").hide();
           jQuery(this).find("div.myDIV").toggle();

        });
      });
   </script>

Wordpress acf试图隐藏和显示列表中的div，使用acf repeater字段

1 个答案: