【问题标题】:How to implement AJAX commenting in WordPress如何在 WordPress 中实现 AJAX 评论
【发布时间】:2014-02-24 12:42:58
【问题描述】:

我正在尝试使用本教程Ajaxify WordPress Comments在 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;
        });
});

每次我发表评论时,我都会收到:“请稍等片刻,然后再发表您的下一条评论”。希望有人能告诉我我做错了什么?

【问题讨论】:

  • 你试试data和textStatus的值是多少?在success里面放一些console.log(data); console.log(textStatus);
  • 刚刚完成... console.log(data); 的值和 console.log(textStatus);就是成功
  • 如果是这样,它应该是“感谢您的评论。我们感谢您的回复。”信息!你看到数据库中的评论了吗?
  • 是的!评论在数据库中。我同意,我应该看到“感谢您的评论。我们感谢您的回复。”消息,但由于某种原因我不是。这就是问题......这让我很困惑
  • 什么是formurl?应该是什么?教程不解释

标签: javascript php jquery ajax wordpress


【解决方案1】:

试试这个:

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;
    });
});

【讨论】:

  • 太棒了!我现在得到:“感谢您的评论。我们感谢您的回复”。此外,我可以看到评论在数据库中,但问题是评论文本不会显示在屏幕上,直到我进行手动页面刷新
  • @gonzalo-naveira 您还应该给出解释,而不仅仅是复制/粘贴+编辑代码。这个网站应该互相教/互相学习,不是“谁来做我的功课?”网站。
  • @Dragos 我们已经在 cmets 中讨论过了。请参见上文。
  • @henrywright 您的 cmets 会自动显示吗?还是需要先审核?
  • @henrywright 你应该将评论添加到 DOM 中成功!
猜你喜欢
  • 2016-12-03
  • 1970-01-01
  • 2012-04-23
  • 2020-04-19
  • 2017-09-10
  • 1970-01-01
  • 2015-12-11
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多