如何在动态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 ?>，所以它不会显示在客户端的呈现页面中。