WordPress カスタムフィールド検索／get_posts で json へ格納／ajax で出力

◯HTML（あらかじめ選択項目はカスタムフィールドで作成する）

<select class="select_01">
	<option value="select_01_01">選択項目1_1</option>
	<option value="select_01_02">選択項目1_2</option>
	<option value="select_01_03">選択項目1_3</option>
</select>
<select class="select_02">
	<option value="select_02_01">選択項目2_1</option>
	<option value="select_02_02">選択項目2_2</option>
	<option value="select_02_03">選択項目2_3</option>
</select>
<input class="button" type="submit" value="検索">
<ul class=“result”>
<!— ここに結果が出力 —>
</ul>

 
◯JS

<script>
$(function(){
	// 2重クリック防止フラグ
	var click_flag = true;
// ボタンクリックイベント
$('.button').click(function(e){
	if ( click_flag ) {
		click_flag = false;

		// セレクトボックスで選択されているvalueを取得
		var select_01 = $('.select_01').val();
		var select_02 = $('.select_02').val();
		$.ajax({
			type: "POST",
			url: ajaxurl,
			data: {
				// データ受け渡し
				'select_01' : select_01,
				'select_02' : select_02,
				'action' : 'ajax_get_posts',
			},
			success: function( response ) {
				jsonData = JSON.parse( response );
				var count = jsonData.length;
				if ( count == '0' ) {
					// 検索結果がない場合
				} else {
					// リストに出力
					$.each( jsonData, function( i, val ){
						$('.result').append('&lt;li&gt;&lt;a href="' + val['permalink'] + '"&gt;' + val['post_title'] + '&lt;/a&gt;&lt;/li&gt;');
					});
				}
				click_flag = true;
			},
			error: function( response ) {
				// ajaxエラーの場合
				click_flag = true;
			}
		});
	}
});

});
</script>

 
◯PHP

<?php
// ajax url
function add_my_ajaxurl() { ?>
	<script>
		var ajaxurl = '<?php echo admin_url( 'admin-ajax.php'); ?>';
	</script>
<?php }
add_action( 'wp_head', 'add_my_ajaxurl', 1 );
// get_postsでデータをjsonへ
function ajax_get_posts(){
// jsから受け渡しするデータ
$select_01 = $_POST[‘select_01’];
$select_02 = $_POST[‘select_02’];
$returnObj = array();

// get_posts オプション
$args = array(
	'post_type' =&gt; 'post',
	'numberposts' =&gt; -1,
	'meta_query' =&gt; array(
		'relation' =&gt; 'AND',
		array(
			'key' =&gt; 'select',
			'value' =&gt; $select_01,
			'compare' =&gt; 'LIKE'
		),
		array(
			'key' =&gt; 'select',
			'value' =&gt; $select_02,
			'compare' =&gt; 'LIKE'
		)
	)
);
$posts = get_posts( $args );
foreach( $posts as $key =&gt; $post ) {
	$returnObj[$key] = array(
		// 出力するデータを格納
		'post_title' =&gt; $post-&gt;post_title,
		'permalink' =&gt; get_permalink( $post-&gt;ID ),
	);
}

// json形式に出力
echo json_encode( $returnObj );
die();

}
add_action( ‘wp_ajax_ajax_get_posts’, ‘ajax_get_posts’ );
add_action( ‘wp_ajax_nopriv_ajax_get_posts’, ‘ajax_get_posts’ );
?>

JSで格納した変数（セレクトボックスのvalue値）の受け渡しに引っかかりましたが data としていれてあげて $_POST で受け取りをしてくれるとのこと。チェックボックスなど複数選択の場合はもう少し複雑で meta_query の指定などを変更する必要あり。
 
◯参考
・WordPressでAjaxを使う方法の解説 | hijiriworld Web
・jQuery：Ajaxを使用してPOST送信でデータ取得 | raining
・query_posts（WP_Queryクラス）でカスタムフィールドを使う:WordPress私的マニュアル