提交后显示评论

Question

在我的 wordpress 网站中，我有一个标准的评论提交表单。我已经向它添加了一个脚本（ajax），所以我不必重新加载页面来提交评论。一切正常，但如何在不刷新页面的情况下显示提交的评论？

我的代码：

jQuery('document').ready(function($){  
var commentform=$('form#commentform');  
commentform.prepend('<div id="wdpajax-info" ></div>');  
var infodiv=$('#wdpajax-info');  
commentform.validate({  
    submitHandler: function(form){  
        var formdata=commentform.serialize();  
        infodiv.html('<p>Proszę czekać...</p>');  
        var formurl=commentform.attr('action');  
        $.ajax({  
            type: 'post',  
            url: formurl,  
            data: formdata,  
            error: function(XMLHttpRequest, textStatus, errorThrown){  
                infodiv.html('<p class="wdpajax-error" >Sprawdź wszystkie pola!</p>');  
            },  
            success: function(data, textStatus, html){
                $("ul.commentlist").append(formdata);
                $("ul.commentlist li:last").fadeIn("slow");
                if(data=="success")  
                    infodiv.html('<p class="wdpajax-success" >Dzięki, komentarz został dodany!</p>');  
                else  
                    infodiv.html('<p class="wdpajax-error" >Błąd</p>');  
                commentform.find('textarea[name=comment]').val('');  
            }  
        });  
    }  
  });  
});

Answer 1

我建议刷新页面，以便用户可以看到评论确实已保存在服务器端。 如果您仍然想在不刷新页面的情况下执行此操作，您应该添加一个带有评论的新 div。类似的东西：

success: function(data, textStatus, html){
            $("ul.commentlist").append(formdata);
            $("ul.commentlist li:last").fadeIn("slow");
            if(data=="success")  {
              infodiv.html('<p class="wdpajax-success" >Dzięki, komentarz został dodany!</p>');  
              // you should inicialize commentdiv with the selector of the part of the page you want to show the comment
              commentdiv.html('<p class="comment">'+formdata+'</p>');
}