Javascript 如何在WordPress中实现AJAX评论

我正试图使用本教程在WordPress中对评论进行“ajaxify”

以下是我的PHP处理程序：

function ajaxify_comments( $comment_ID, $comment_status ){
    if( ! empty( $_SERVER['HTTP_X_REQUESTED_WITH'] ) && strtolower( $_SERVER['HTTP_X_REQUESTED_WITH'] ) == 'xmlhttprequest' ) {
        //If AJAX Request Then
        switch( $comment_status ) {
            case '0':
                //notify moderator of unapproved comment
                wp_notify_moderator( $comment_ID );
            case '1': //Approved comment
                echo "success";
                $commentdata = &get_comment( $comment_ID, ARRAY_A );
                $post = &get_post( $commentdata['comment_post_ID'] );
                wp_notify_postauthor( $comment_ID, $commentdata['comment_type'] );
                break;
            default:
                echo "error";
        }
        exit;
    }
}
add_action( 'comment_post', 'ajaxify_comments', 20, 2 );

这是我的剧本：

jQuery('document').ready(function($){
    var commentform=$('#commentform'); // find the comment form
    commentform.prepend('<div id="comment-status" ></div>'); // add info panel before the form to provide feedback or errors
    var statusdiv=$('#comment-status'); // define the infopanel

    commentform.submit(function(){
        //serialize and store form data in a variable
        var formdata=commentform.serialize();
        //Add a status message
        statusdiv.html('<p>Processing...</p>');
        //Extract action URL from commentform
        var formurl=commentform.attr('action');
        //Post Form with data
        $.ajax({
            type: 'post',
            url: formurl,
            data: formdata,
            error: function(XMLHttpRequest, textStatus, errorThrown){
                statusdiv.html('<p class="ajax-error" >You might have left one of the fields blank, or be posting too quickly</p>');
                                },
            success: function(data, textStatus){
                if(data=="success")
                    statusdiv.html('<p class="ajax-success" >Thanks for your comment. We appreciate your response.</p>');
                else
                    statusdiv.html('<p class="ajax-error" >Please wait a while before posting your next comment</p>');
                    commentform.find('textarea[name=comment]').val('');
                                }
                });
                return false;
        });
});

jQuery（'document'）.ready（函数（$）{
var commentform=$（'#commentform'）；//查找注释表单
commentform.prepend（“”）；//在表单之前添加信息面板以提供反馈或错误
var statusdiv=$（“#注释状态”）；//定义infopanel
commentform.submit（函数（）{
//序列化表单数据并将其存储在变量中
var formdata=commentform.serialize（）；
//添加状态消息
html（“处理…
”）；
//从commentform中提取操作URL
var formurl=commentform.attr（'action'）；
//用数据发布表单
$.ajax({
键入：“post”，
url:formurl，
数据：formdata，
错误：函数（XMLHttpRequest、textStatus、errorshown）{
html（“
您可能将其中一个字段留空，或者过账过快”
”；
},
成功：功能（数据、文本状态）{
如果（数据=“成功”）
html（“
感谢您的评论。我们感谢您的回复。
”；
其他的
html（“
请稍等片刻，然后再发布下一条评论”
”；
commentform.find（'textarea[name=comment]'）.val（''；
}
});
返回false；
});
});

每次我发表评论时，我都会得到：“请稍等片刻，然后再发表下一条评论”。希望有人能告诉我我做错了什么？

试试这个：

jQuery('document').ready(function($){
    var commentform=$('#commentform'); // find the comment form
    commentform.prepend('<div id="comment-status" ></div>'); // add info panel before the form to provide feedback or errors
    var statusdiv=$('#comment-status'); // define the infopanel

    commentform.submit(function(){
        //serialize and store form data in a variable
        var formdata=commentform.serialize();
        //Add a status message
        statusdiv.html('<p>Processing...</p>');
        //Extract action URL from commentform
        var formurl=commentform.attr('action');
        //Post Form with data
        $.ajax({
            type: 'post',
            url: formurl,
            data: formdata,
            error: function(XMLHttpRequest, textStatus, errorThrown)
                {
                    statusdiv.html('<p class="ajax-error" >You might have left one of the fields blank, or be posting too quickly</p>');
                },
            success: function(data, textStatus){
                if(data == "success" || textStatus == "success"){
                    statusdiv.html('<p class="ajax-success" >Thanks for your comment. We appreciate your response.</p>');
                }else{
                    statusdiv.html('<p class="ajax-error" >Please wait a while before posting your next comment</p>');
                    commentform.find('textarea[name=comment]').val('');
                }
            }
        });
        return false;
    });
});

jQuery（'document'）.ready（函数（$）{
var commentform=$（'#commentform'）；//查找注释表单
commentform.prepend（“”）；//在表单之前添加信息面板以提供反馈或错误
var statusdiv=$（“#注释状态”）；//定义infopanel
commentform.submit（函数（）{
//序列化表单数据并将其存储在变量中
var formdata=commentform.serialize（）；
//添加状态消息
html（“处理…
”）；
//从commentform中提取操作URL
var formurl=commentform.attr（'action'）；
//用数据发布表单
$.ajax({
键入：“post”，
url:formurl，
数据：formdata，
错误：函数（XMLHttpRequest、textStatus、errorshown）
{
html（“
您可能将其中一个字段留空，或者过账过快”
”；
},
成功：功能（数据、文本状态）{
如果（数据==“成功”| |文本状态==“成功”）{
html（“
感谢您的评论。我们感谢您的回复。
”；
}否则{
html（“
请稍等片刻，然后再发布下一条评论”
”；
commentform.find（'textarea[name=comment]'）.val（''；
}
}
});
返回false；
});
});

尝试时，数据和文本状态的价值是什么？放置一些

console.log（数据）；console.log（textStatus）内部成功。刚刚完成。。。console.log（数据）的值；和console.log（textStatus）；成功了吗？如果是的话，应该写上“谢谢你的评论。我们感谢你的回复”的信息！你在数据库中看到评论了吗？是的！注释在数据库中。我同意，我应该看到“谢谢你的评论。我们感谢你的回复”的信息，但出于某种原因我没有看到。这就是问题所在。。。我很困惑什么是
formurl
？应该是什么？教程没有解释太好了！我现在得到：“谢谢你的评论。我们感谢你的回复。”。此外，我可以在数据库中看到注释，但问题是在我完成手动页面之前，注释文本不会显示在屏幕上refresh@gonzalo-naveira您还应该给出解释，而不仅仅是复制/粘贴+编辑代码。这个网站应该是互相教授/学习的，而不是一个“谁来做我的家庭作业？”的网站。@Dragos我们已经在评论中讨论过了。请参见上文。@henrywright是否自动显示您的评论？还是需要先对其进行审核？@henrywright您应该在成功中向DOM添加评论！