Show Post Content with AJAX

时间:2014-09-01 作者:la1ch3

我想做一个非常基本的AJAX调用,单击列表项,容器div将填充从Wordpress页面提取的相关内容。我是AJAX的新手;今天我尝试了几条不同的路线,但都没有用。我得到了要加载到容器中的页面,但我只需要post内容(就像我在div中调用了\\u content(),但使用AJAX风格)。我只有三页想翻阅。

有人知道一种简单的方法来实现这一点吗?我将不胜感激。非常感谢。

2 个回复
SO网友:jgraup

创建JSON endpoint 接受WP_Post 身份证件

add_action( \'rest_api_init\', function() {
    register_rest_route( \'api/v2\', \'/post/(?<id>\\d+)\', array (
        \'methods\'  => \'GET\',
        \'callback\' => \'get_post_content\',
    ) );
} );
处理端点以根据传递的ID返回帖子的内容。

function get_post_content( WP_REST_Request $request ) {

    $post = get_post( absint( $request->get_param( \'id\' ) ) );

    if ( ! $post ) {
        return \'Invalid ID\';
    }

    return apply_filters( \'the_content\', $post->post_content );
}
使用获取数据jQuery.

<script>
jQuery.get( "/wp-json/api/v2/post/504", function( data ) {

    jQuery( ".result" ).html( data );

});
</script>

(可选)-Localize 这个REST URL .

wp_localize_script( \'wp-api\', \'wpApiSettings\', array( \'root\' => esc_url_raw( rest_url() ) ) );

<script>
jQuery.get( wpApiSettings.root + "api/v2/post/504", function( data ) {
    jQuery( ".result" ).html( data );
});
</script>

SO网友:Tomás Cot

您需要这样的PHP代码,可以将其添加到函数中。php,或者我建议创建一个插件。

add_action(\'wp_ajax_nopriv_action_name\', \'ajax_function\');
add_action(\'wp_ajax_action_name\', \'ajax_function\');


function ajax_function(){

$post = get_post($_POST[\'post_id\']);

$response = array("content"=> apply_filters(\'the_content\', $post->post_content));
$response = json_encode($response);
echo $response;
die();

}
您还需要Javascript来进行调用:

var data = {
        \'action\': \'action_name\'
        \'post_id\' : id //you can get it with jQuery

    };
jQuery.post(AJAX_URL , data, function(response) {


 //do what you need with the response

}
AJAX\\u URL位于域中。com/wp-admin/admin-ajax。php,您可以使用admin_url( \'admin-ajax.php\' )

你可以阅读更多here. 记住要包含jQuery,建议使用wp\\u enqueue\\u脚本,more here.

这段代码没有经过测试,所以至少应该有一些语法错误。

结束

相关推荐

插件在AJAX调用中不起作用

我正在进行进度条购物体验(在我的WooCommerce网站上)。首先,用户选择计划(demo、home、business、premium),然后选择他想要的产品,最后我要向他们展示cart表。我使用以下代码使用AJAX发送项目(在同一模板中):<?php if(isset($_POST[\'action\'])) { global $woocommerce; $woocommerce->cart->empty_ca