如何在动态php文件中切换每个带toggle()函数的div

Question

我正在最小化列表块的视觉显示，我想使用切换按钮来隐藏默认情况下不想出现的内容。

我几乎可以在next() jquery属性中完成这个操作，但是这迫使我将按钮放在我想要隐藏的内容的前一个元素中(这就是为什么它被称为NEXT)，但是我希望隐藏下面的类内容两个或三个类元素。我该怎么做呢？我试过和兄弟姐妹在一起，但没有成功。

        if ( tribe_get_cost() ) : 
            $event_cost='<!-- Event Cost -->
            <div class="ect-event-cost">
                <span>'.tribe_get_cost($event_id, true ).'</span>
            </div>';
            endif;

            $event_title='<a class="ect-event-url" href="'.esc_url( tribe_get_event_link()).'" rel="bookmark">'. get_the_title().'</a>';


            $event_content='<button class="btn1" class="button">More..</button><!-- Event Content --><div class="p1"><div class="ect-event-content">';
              $event_content.=tribe_events_get_the_excerpt($event_id, wp_kses_allowed_html( 'post' ) );

            $event_content.='<a href="'.esc_url( tribe_get_event_link($event_id) ).'" class="ect-events-read-more" rel="bookmark">'.esc_html__( 'Find out more', 'the-events-calendar' ).' &raquo;</a></div></div></div>';
    /*

$(document).ready(function () {
    $(".p1").hide();

    $(".btn1").click(function(){
        $(this).next(".p1").toggle()
    });

  });

Answer 1

你知道为什么.next()不使用$(this).next(".p1").toggle()吗？

因为您在中间有一个注释：<!-- Event Content -->。

它会奏效的。注释标记是元素。把它移开再试一次。

既然你用PHP..。建议您将这种注释放在一些PHP注释中，比如：<?php // Event Content ?>，这样它就不会显示在客户端呈现的页面中。