ReferenceError:通过Ajax加载Wordpress帖子时未定义ajax_object

Question

我一直在尝试在这个帖子中实现@SagiveSEO的推荐: 通过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主题的子目录).

Answer 1

您没有本地化您的ajax对象.在二十五个主题中,你会这样做 - 在functions.php你放的时候

wp_localize_script( 'twentyfifteen-script', 'ajax_object', array(
    'ajaxurl' => admin_url( 'admin-ajax.php' ),
));

您的脚本排队的位置.

在你的主题中一定要使用正确的句柄 - 而不是'twentyfifteen-script'把你的ajax代码放在那里.所以如果你的ajax JavaScript位于一个名为的文件中custom.js,并且你已经用句柄排列了那个脚本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' ),
        ));
    }
}

或者至少寻找这样的代码,然后将本地化放在那里:)