我一直在尝试在这个帖子中实现@SagiveSEO的推荐: Proper way to load a single post via Ajax?
想法:点击按钮并通过AJAX加载帖子。我们的想法是,您将拥有一个按钮树,以便人们快速浏览有用的内容。
不幸的是,它失败了。
在控制台中,我收到消息“ReferenceError:ajax_object is not defined”,它引用“$ .post(ajax_object.ajaxurl ...”
行。我做错了什么?
这是我的HTML:
<button class="get_project" data-postid="3300">PROJECT NAME</button>
<div class="postcontainer"></div>
这是我的Javascript:
jQuery(function($){
$('.get_project').click(function() {
var postid = $(this).data('postid'); // Amended by @dingo_d
$.post(ajax_object.ajaxurl, {
action: 'my_load_ajax_content ',
postid: postid
}, function(data) {
var $response = $(data);
var postdata = $response.filter('#postdata').html();
$('.postcontainer').html(postdata);
});
})
//alert( "hello world" );
});
这是我的functions.php文件中的php:
function my_load_ajax_content () {
$pid = intval($_POST['post_id']);
$the_query = new WP_Query(array('p' => $pid));
if ($the_query->have_posts()) {
while ( $the_query->have_posts() ) {
$the_query->the_post();
$data = '
<div class="post-container">
<div id="project-content">
<h1 class="entry-title">'.get_the_title().'</h1>
<div class="entry-content">'.get_the_content().'</div>
</div>
</div>
';
}
}
else {
echo '<div id="postdata">'.__('Didnt find anything', THEME_NAME).'</div>';
}
wp_reset_postdata();
echo '<div id="postdata">'.$data.'</div>';
}
// Next two lines corrected - thanks @dingo_d
add_action ( 'wp_ajax_my_load_ajax_content', 'my_load_ajax_content' );
add_action ( 'wp_ajax_nopriv_my_load_ajax_content', 'my_load_ajax_content' );
脚本入队函数中的functions.php也需要:
wp_enqueue_script( 'myajaxpostloader', get_template_directory_uri().'/js/ajax.js', array( 'jquery' ), '1.0', true );
wp_localize_script( 'myajaxpostloader', 'ajax_object', array(
'ajaxurl' => admin_url( 'admin-ajax.php' )
));
(请注意,我的Javascript保存为/js/ajax.js,其中/ js /是Wordpress主题的子目录。)
答案 0 :(得分:7)
您没有本地化您的ajax对象。在二十五个主题中,你可以这样做 - 在functions.php
中你放
wp_localize_script( 'twentyfifteen-script', 'ajax_object', array(
'ajaxurl' => admin_url( 'admin-ajax.php' ),
));
您的脚本已加入队列。
在你的主题中一定要使用正确的句柄 - 而不是'twentyfifteen-script'
把你的ajax代码放在你的位置。所以如果你的ajax JavaScript位于一个名为custom.js
的文件中,你和#39;我已使用句柄custom_js
将该脚本排入队列,然后您将
wp_localize_script( 'custom_js', 'ajax_object', array(
'ajaxurl' => admin_url( 'admin-ajax.php' ),
));
在你排队了那个剧本之后。总而言之,在您functions.php
中,您可以使用以下内容:
add_action('after_setup_theme', 'mytheme_theme_setup');
if ( ! function_exists( 'mytheme_theme_setup' ) ){
function mytheme_theme_setup(){
add_action( 'wp_enqueue_scripts', 'mytheme_scripts');
}
}
if ( ! function_exists( 'mytheme_scripts' ) ){
function mytheme_scripts() {
wp_enqueue_script( 'custom_js', get_template_directory_uri().'/js/custom.js', array( 'jquery'), '1.0.0', true );
wp_localize_script( 'custom_js', 'ajax_object', array(
'ajaxurl' => admin_url( 'admin-ajax.php' ),
));
}
}
或者至少寻找这样的代码,然后将本地化放在那里:)