Wordpress使用查询作为AJAX

时间:2018-08-24 14:17:57

标签: php ajax wordpress

我有一个自定义字段选择框,从中可以选择要显示的帖子。现在,我希望在查询中以某种方式将其用作选定的帖子及其自定义字段,以用作AJAX调用,以便可以使用数据输出来构建masonry网格。有可能吗?

这是我的数据/查询:

$posts = get_field('choose_artist');

if( $posts ): ?>
<?php foreach( $posts as $p ): ?>
    <div class="artist">
        <a href="<?php echo get_permalink( $p->ID ); ?>">
                <div style="position: relative;">
                    <?php $image = get_field('artist_image', $p->ID); ?>
                    <div class="artist-image" style="background-image:url('<?php echo $image['url']; ?>')"></div>
                    <div class="overlay">
                        <div class="content">
                            <p><?php the_field('artist_name', $p->ID); ?></p>
                        </div>
                    </div>
                </div>
            </a>
    </div>
<?php endforeach; ?>

所以,我的目标是:

$.ajax({
 url: '/the query above',
 success: function(data){
     data is the query html
 }})

那有可能吗?

1 个答案:

答案 0 :(得分:1)

ajax.php

     $content = '';
     if( $posts ) {
        foreach( $posts as $p ) {
            $image = get_field('artist_image', $p->ID);
            $content .= '<div class="artist">';
            $content .= '<a href="' . get_permalink( $p->ID ) . '">';
            $content .= '<div style="position: relative;">';
            $content .= '<div class="artist-image" style="background-image:url("' . $image['url'] . '")"></div>';
            $content .= '<div class="overlay">';
            $content .= '<div class="content">';
            $content .= '<p>' . get_the_field('artist_name', $p->ID). '</p>';
            $content .= '</div>';
            $content .= '</div>';
            $content .= '</div>';
            $content .= '</a>';
            $content .= '</div>';
        }   
     }
     echo $content;

main.js / .php(无论您何时调用ajax)

$.ajax({
 url: '/ajax.php', //Path to the ajax.php script
 success: function(data){
     console.log(data);
 }});

查看文档以获取错误,如何检查成功等信息:http://api.jquery.com/jquery.ajax/

有更好的方法来制作AJAX页面,因此对其进行重构并使其更整洁,但是如果我了解您的需求,则与上述类似的内容应该对您有用,尽管您可能需要对其进行调整才能得到什么你想要的。