使用PHP和Session管理页面重载后按钮的活跃状态

<?php
session_start(); // 必须放在脚本的最顶部
// 其他PHP代码...
?>

<div style="margin-top: 20px; margin-left: 40px;">
    <p>显示所有会议</p>
    <form method="POST">
        <div class="tab-content">
            <!-- 'On' 按钮 -->
            <button style="margin-left: 35px;" type="submit" name="submitBtn_on" 
                    class="btn btn-primary" data-toggle="button">
                On
            </button>
            <!-- 'Off' 按钮 -->
            <button style="margin-left: -8px;" type="submit" name="submitBtn_off" 
                    class="btn btn-secondary" data-toggle="button">
                Off
            </button>
        </div>
    </form>
</div>

<?php
session_start(); // 确保在任何HTML输出之前调用

// 定义默认状态，例如默认显示未来会议（'off'状态）
if (!isset($_SESSION['conference_filter_state'])) {
    $_SESSION['conference_filter_state'] = 'off';
}

// 处理表单提交
if (isset($_POST['submitBtn_on'])) {
    $_SESSION['conference_filter_state'] = 'on';
} elseif (isset($_POST['submitBtn_off'])) {
    $_SESSION['conference_filter_state'] = 'off';
}

/**
 * 根据Session中存储的状态返回会议过滤日期。
 * 'on' 状态表示显示所有会议（通过返回一个非常早的日期）。
 * 'off' 状态表示只显示未来会议（通过返回今天的日期）。
 *
 * @return string 格式为 'YYYY-MM-DD' 的日期字符串。
 */
function switch_on_off() 
{
    $filterDate = date('Y-m-d'); // 默认显示今天及以后的会议

    if (isset($_SESSION['conference_filter_state'])) {
        if ($_SESSION['conference_filter_state'] === 'on') {
            // 'on' 状态：显示所有会议，使用一个非常早的日期
            $filterDate = '1970-01-01'; // 确保能包含所有历史会议
        } else {
            // 'off' 状态：显示未来会议，使用当前日期
            $filterDate = date('Y-m-d');
        }
    }
    return $filterDate;
}

/**
 * 获取符合过滤条件的会议列表。
 *
 * @return array 会议文章对象数组。
 */
function get_filtered_conferences() 
{ 
    $filterDate = switch_on_off(); // 获取当前过滤日期

    $args = array(
        'numberposts' => -1,
        'post_type'   => 'conference',
        'post_status' => 'publish',
        'meta_key'    => 'conference_start_date',
        'orderby'     => 'meta_value',
        'order'       => 'ASC',
        'meta_query'  => array(
            array(
                'key'     => 'conference_start_date',
                'value'   => $filterDate,
                'compare' => '>=',
                'type'    => 'DATE' // 明确指定比较类型为日期
            ),
        ),
    );
    $conferences = get_posts( $args ); // 假设 get_posts 是一个可用的WordPress或自定义函数
    return $conferences;
}

// 获取会议数据
$conferences_list = get_filtered_conferences();

// 根据Session状态动态生成按钮的CSS类
$on_btn_class = ($_SESSION['conference_filter_state'] === 'on') ? 'btn btn-primary active' : 'btn btn-primary';
$off_btn_class = ($_SESSION['conference_filter_state'] === 'off') ? 'btn btn-secondary active' : 'btn btn-secondary';

?>

<!-- HTML 部分 -->
<div style="margin-top: 20px; margin-left: 40px;">
    <p>显示所有会议</p>
    <form method="POST">
        <div class="tab-content">
            <!-- 'On' 按钮，动态添加 active 类 -->
            <button style="margin-left: 35px;" type="submit" name="submitBtn_on" 
                    class="<?php echo $on_btn_class; ?>">
                On
            </button>
            <!-- 'Off' 按钮，动态添加 active 类 -->
            <button style="margin-left: -8px;" type="submit" name="submitBtn_off" 
                    class="<?php echo $off_btn_class; ?>">
                Off
            </button>
        </div>
    </form>
</div>

<!-- 示例：显示会议列表 -->
<h3>会议列表</h3>
<?php if (!empty($conferences_list)): ?>
    <ul>
        <?php foreach ($conferences_list as $conference): ?>
            <li><?php echo esc_html($conference->post_title); ?> - 
                <?php echo esc_html(get_post_meta($conference->ID, 'conference_start_date', true)); ?>
            </li>
        <?php endforeach; ?>
    </ul>
<?php else: ?>
    <p>没有找到符合条件的会议。</p>
<?php endif; ?>