Question

我在wordpress中具有这种结构。

<input type="text" id="search_subject">
<button id="btn_search_subject">Send</button>

<div id="results_search"></div>
<button id="back">Previous</button>
<button id="next">Next</button>

我想搜索一个单词，并通过AJAX将第一个结果加载到div #results_search

我查找了一些教程，但是，我不太了解，有些教程将所有代码都包含在functions.php文件中，而其他教程则将编码分成了ajax.js文件。

可能只是在帖子标题中进行搜索

Answer 1

这是HTML代码

<input class="form-control" placeholder="Search" id="search_posts" name="_posts" type="text" autocomplete="off" value="">
<input type="hidden" value="<?php echo admin_url('admin-ajax.php');?>" id="ajax_url_input">

这是Jquery代码

jQuery( "#search_posts" ).keyup( function() {
    var search_posts = jQuery(this).val();
    var ajax_url = jQuery('#ajax_url_input').val();
    jQuery.ajax({
        type:'POST',
        url: ajax_url,
        data: {
            action: 'search_data',
            search_posts: search_posts,
        },
        beforeSend: function(){
        },
        success:function(data){
        }
    });
});

这是Ajax的PHP函数

function search_data() {
$search = '';
if(isset($_POST['search_posts'])){
    $args = array( 
        'posts_per_page' => -1,
        'post_type'=> 'posts',
        'post_status'=> 'publish',
        's' => $_POST['search_posts']
    );
}
$services_data = get_posts( $args );
}
add_action('wp_ajax_search_data', 'search_data');
add_action('wp_ajax_nopriv_search_data', 'search_data');

此代码将搜索帖子标题和帖子内容中的文本。

在Wordpress中搜索帖子，然后通过AJAX加载

1 个答案: