我已经花了大约一周的时间试图解决这个问题，我有几种不同的方法可以“奏效”，但我觉得这些方法并不是该项目的最佳/正确解决方案。

我试图做以下工作：我已经得到了通过WP Posts循环填充的网格项。然后将网格项本身包装在一个标记中，其中post ID作为数据属性抓取，如下所示：

            <section class="GRIDSECTION">

                <?php 
                    query_posts(\'post_type=CUSTOMTYPE\');
                    while (have_posts()) : the_post(); 
                    $postID = get_the_ID(); 
                ?>

                <a class="GRIDITEM" href="#" data-post_id=\'<?php echo $postID; ?>\' data-post_type=\'POST-TYPE\'>

                    <h2><?php the_title(); ?></h2>

                    <span><?php the_field(\'CUSTOM-CONTENT\');?></span>

                </a>

                <?php 
                    endwhile;      
                ?>
            </section>

然后，我的AJAX脚本基于我所阅读的一些内容：

console.log(\'01 - AJAX Loaded\');

$(".GRIDITEM").click(function () {

    console.log(\'02 - AJAX Starting\');

    //var id_post = $(this).attr(\'post_id\');
    $.ajax({
        type: \'POST\',
        url: \'<?php echo admin_url(\'admin-ajax.php\'); ?>\',
        data: {
            \'post_id\': ?????,
            \'action\': \'f711_get_post_content\' //this is the name of the AJAX method called in WordPress
        }, success: function (result) {
            console.log(\'03a - SUCCESS\');
           alert(result);
        },
        error: function () {
            alert("error");
            console.log(\'03b - FAILURE\');
        }
    });

});

我不确定如何使用此方法将ID传递到数据类型。我想，一旦我成功地传递了post\\u id，我就可以对post-TYPE做同样的事情。

我打算做的是将Post ID和自定义Post类型传递到Ajax中，以发送和接收GRIDITEM表示的Post。

然后，当然，回到我开始的地方。

这是我想要实现的总体感觉。

http://tympanus.net/Development/AnimatedGridLayout/

但由于我们在每篇文章中使用自定义的文章类型和自定义字段，我不知道如何调用它。另外，我刚刚开始使用AJAX。

谢谢

add_action( \'wp_ajax_nopriv_ajax_load_more\', \'ajax_load_more\' );
add_action( \'wp_ajax_ajax_load_more\', \'ajax_load_more\' );

function ajax_load_more(){
    //load more posts
    $post_id = $_POST["post_id"];

$query = new WP_Query( array(
    \'p\' => $post_id,
    \'post_type\' => \'any\'
) );

if( $query->have_posts() ):

    while( $query->have_posts() ): $query->the_post();

        the_title();

    endwhile;

endif;

wp_reset_postdata();

    die();

};

console.log(\'ajax script ready\');
$(document).on(\'click\',\'.ajax-button\', function(){

    var that = $(this);
    var post_id = that.data(\'post_id\');
    var ajaxurl = \'<?php echo admin_url(\'admin-ajax.php\'); ?>\';

    $.ajax({

        url : ajaxurl,
        type: \'post\',
        //dataType: \'json\',
        data : {

            post_id : post_id,
            action : \'ajax_load_more\'

        },
        error : function(response){
            console.log(response);
        },
        success : function(response){

            $(\'#load_here\').append( response );

        }

    });

});