用wordpress根据自定义字段做多重筛选列表的代码

IT资讯

1233
文章

274
评论

2023-03-1323:37:08

评论1,344 2405字

下面的内容是通过chatGPT3.5得到的答案，你们可以试一下，不能保证100%有效。

<?php
 // 获取所有符合条件的文章列表 
$args = array( 
'post_type' => 'post',//文章类型 
'posts_per_page' => -1,//获取所有文章 
'meta_query' => array( 'relation' => 'AND',//多重筛选为 AND 或 OR 
array( 'key' => 'custom_field1',//自定义字段1 
'value' => 'value1',//自定义字段1值 
'compare' => '=' ), 
array( 
'key' => 'custom_field2',//自定义字段2 
'value' => 'value2',//自定义字段2值 
'compare' => '=' ) 
) 
); 

$query = new WP_Query($args); // 如果有符合条件的文章则输出列表 
if ($query->have_posts()) : 
echo '<ul>'; 
while ($query->have_posts()) : $query->the_post(); 
echo '<li>' . get_the_title() . '</li>'; //输出文章标题 
endwhile; echo '</ul>'; // 处理完要恢复 $post 全局变量数据 
wp_reset_postdata(); 
else : 
echo '没有符合条件的文章'; 
endif; 
?>

PS: 请注意修改代码中的自定义字段、值和其他参数以符合您的需求。

让多重筛选字段可以切换选择并输出相关的内容列表:

<!-- 多重筛选器 --> 
<div id="filters"> 
<!-- 筛选器1 --> 
<select id="filter1"> 
<option value="">全部</option> 
<option value="value1">选项1</option>
<option value="value2">选项2</option>
<option value="value3">选项3</option>
</select> 
<!-- 筛选器2 --> 
<select id="filter2"> 
<option value="">全部</option>
<option value="value1">选项1</option> 
<option value="value2">选项2</option>
<option value="value3">选项3</option> 
</select> 
</div> 
<!-- 列表容器 --> 
<div id="results-container"></div>

然后，添加以下 JavaScript 代码在用户选择不同的筛选器的值时，通过 Ajax 请求新的内容列表：

jQuery(document).ready(function($) {
// 当用户选择值时，执行以下代码
$('#filters select').change(function() {
// 获取选择的值
var filter1 = $('#filter1').val();
var filter2 = $('#filter2').val();

// 发送 Ajax 请求并获取新的内容列表
$.ajax({
url: ajaxurl,
type: 'post',
data: {
action: 'my_custom_filter', // 替换为你的 Ajax 处理函数名称
filter1_value: filter1, // 传递筛选器1的值
filter2_value: filter2 // 传递筛选器2的值
},
success: function(response) {
$('#results-container').html(response); // 更新内容列表
}
});
}); 

// 默认加载所有内容
$('#filters select').change();
});

最后，在你的主题的 functions.php 文件中，添加以下 PHP 代码以处理 Ajax 请求和输出内容列表：

add_action('wp_ajax_my_custom_filter', 'my_custom_filter_callback'); 
// 替换为你的 Ajax 处理函数名称
add_action('wp_ajax_nopriv_my_custom_filter', 'my_custom_filter_callback'); 
// 替换为你的 Ajax 处理函数名称

function my_custom_filter_callback() {
$args = array(
'post_type' => 'post',
'posts_per_page' => -1,
'meta_query' => array(
'relation' => 'AND',
array(
'key' => 'custom_field1',
'value' => $_POST['filter1_value'],
'compare' => '='
),
array(
'key' => 'custom_field2',
'value' => $_POST['filter2_value'],
'compare' => '='
)
)
);
$query = new WP_Query($args);

if ($query->have_posts()) :
$output = '<ul>';
while ($query->have_posts()) : $query->the_post();
$output .= '<li>' . get_the_title() . '</li>';
endwhile;
$output .= '</ul>';
wp_reset_postdata();
else :
$output = '没有内容';
endif;

echo $output;
wp_die();
}

注意：在上面的示例代码中，“替换为你的 Ajax 处理函数名称”是占位符。你需要将其替换为你实际使用的 Ajax 处理函数的名称。