选项1

简单方法-返回中的所有帖子JSON 在JavaScript中格式化和循环它们

PHP:

function get_ajax_posts() {
    // Query Arguments
    $args = array(
        \'post_type\' => array(\'products\'),
        \'post_status\' => array(\'publish\'),
        \'posts_per_page\' => 40,
        \'nopaging\' => true,
        \'order\' => \'DESC\',
        \'orderby\' => \'date\',
        \'cat\' => 1,
    );

    // The Query
    $ajaxposts = get_posts( $args ); // changed to get_posts from wp_query, because `get_posts` returns an array

    echo json_encode( $ajaxposts );

    exit; // exit ajax call(or it will return useless information to the response)
}

// Fire AJAX action for both logged in and non-logged in users
add_action(\'wp_ajax_get_ajax_posts\', \'get_ajax_posts\');
add_action(\'wp_ajax_nopriv_get_ajax_posts\', \'get_ajax_posts\');

JavaScript:

$.ajax({
    type: \'POST\',
    url: \'<?php echo admin_url(\'admin-ajax.php\');?>\',
    dataType: "json", // add data type
    data: { action : \'get_ajax_posts\' },
    success: function( response ) {
        $.each( response, function( key, value ) {
            console.log( key, value ); // that\'s the posts data.
        } );
    }
});

选项2获取HTML内容并将其打印到屏幕上。

PHP:

function get_ajax_posts() {
    // Query Arguments
    $args = array(
        \'post_type\' => array(\'products\'),
        \'post_status\' => array(\'publish\'),
        \'posts_per_page\' => 40,
        \'nopaging\' => true,
        \'order\' => \'DESC\',
        \'orderby\' => \'date\',
        \'cat\' => 1,
    );

    // The Query
    $ajaxposts = new WP_Query( $args );

    $response = \'\';

    // The Query
    if ( $ajaxposts->have_posts() ) {
        while ( $ajaxposts->have_posts() ) {
            $ajaxposts->the_post();
            $response .= get_template_part(\'products\');
        }
    } else {
        $response .= get_template_part(\'none\');
    }

    echo $response;

    exit; // leave ajax call
}

// Fire AJAX action for both logged in and non-logged in users
add_action(\'wp_ajax_get_ajax_posts\', \'get_ajax_posts\');
add_action(\'wp_ajax_nopriv_get_ajax_posts\', \'get_ajax_posts\');

JavaScript:

   $.ajax({
        type: \'POST\',
        url: \'<?php echo admin_url(\'admin-ajax.php\');?>\',
        dataType: "html", // add data type
        data: { action : \'get_ajax_posts\' },
        success: function( response ) {
            console.log( response );

            $( \'.posts-area\' ).html( response ); 
        }
    });

在第二个示例中，更改.posts-area 要打印的选择器。

这个console.log 只是您可以在控制台中看到AJAX调用返回的信息。你应该在完成后移除它。