wp_query with ajax

时间:2019-02-14 作者:desh

我正在尝试使用带有AJAX的WP\\U QUERY按年过滤帖子,当前使用的生成器是DIVI(用于前端)。

Result

所有内容都加载得很好,我面临着最后一个障碍,那就是当我使用select下拉菜单过滤帖子时,它抛出的结果包括html标记。

我的结果可以在这个附件中找到。enter image description here

Expected Results

我想加载没有这个html标签的帖子内容。

What I have tried

我试过使用

$content = apply_filters( \'the_content\' , wp_strip_all_tags(get_the_content())); 
但它仍然会弹出html标记。

这是我此查询的完整代码

functions.php

// to connect to ajax
function asb_blog_clone()
{
  if (is_page(7526)) {
    wp_enqueue_script(\'asb_blog_clone.js\' ,get_template_directory_uri() . \'/js/asb_blog_clone.js\' , array(\'jquery\') , false);
   }
}
add_action(\'wp_enqueue_scripts\' , asb_blog_clone);

// to load the result from ajax
function filter_post_asb_clone()
{
    // ob_start();
    $args = array(
        \'year\' => $_POST[\'year\'] ,
        \'cat\' => array(42 , 43)
    );
    $query = new WP_Query($args);
    if ( $query -> have_posts()) :
?>
    <div class="container">
        <ul class="display-posts-listing">
            <?php while($query -> have_posts()) : $query -> the_post(); ?>
            <li class="listing-item">
                <h4><?php the_title();?></h4>
                <?php
                    $content = apply_filters( \'the_content\' , get_the_content());
                    echo $content;
                ?>
                <?php the_post_thumbnail();?>
            </li>
            <?php endwhile ; ?>
            <?php wp_reset_postdata();?>
        </ul>
    </div>
<?php
    endif;
    // echo ob_get_clean();
    return $query;
    exit;
}
add_action(\'wp_ajax_year_selector\', \'filter_post_asb_clone\');
add_action(\'wp_ajax_nopriv_year_selector\', \'filter_post_asb_clone\');

asb_blog_clone.js [To send Ajax Request]

jQuery(document).ready(function($)
{
    // add css for select
    const start = 2017;
    const year = $(\'#year\')
    displayYear(start)
    setValueToOption()
    year.change(function(){
        let $year = $(\'#year option:selected\').text()
        $.ajax({
            url:\'http://uat.asb.edu.my/wp-admin/admin-ajax.php\' , //#endregion
            type : \'POST\' , //#endregion
            data : \'action=year_selector&year=\' + $year , //#endregion
            success : function (results) {
                // $(\'.load-result\').html(results)
                $(\'.display-posts-listing\').children().empty();
                $(results).addClass(\'.listing-item\')
                $(\'.display-posts-listing\').append(results)
            }
        })
    })
    year.css({
        \'background-color\' : \'#0D3A7C\' ,
        \'color\' : \'#fff\',
        \'width\' : \'25%\'
    })
    year.mouseenter(function(){
        year.css(\'background-color\' , \'#AA1E46\')
    })
    year.mouseleave(function(){
        year.css(\'background-color\' , \'#0D3A7C\')
    })
})
请对此提出建议。

非常感谢您抽出时间。

1 个回复
SO网友:desh

所以,我找到了一个解决办法。我只是显示摘录(),然后将它们链接到这篇文章的permalink()。

//从ajax加载结果

function filter_post_asb_clone()
{
    // ob_start();
    $args = array(
        \'year\' => $_POST[\'year\'] ,
        \'cat\' => array(42 , 43)
    );
    $query = new WP_Query($args);
    if ( $query -> have_posts()) :
?>
    <div class="container">
        <ul class="display-posts-listing">
            <?php while($query -> have_posts()) : $query -> the_post(); ?>
            <a href="<?php echo the_permalink(); ?>">
                <li class="listing-item">
                <h4><?php the_title();?></h4>
                <?php
                    echo the_excerpt();
                ?>
                <?php the_post_thumbnail();?>
               </li>
            </a>
            <?php endwhile ; ?>
            <?php wp_reset_postdata();?>
        </ul>
    </div>
<?php
    endif;
    exit;
}
非常感谢你