忙了3个多小时完成了AJAX评论的添加,效果见本博留言部分~
首先感谢已经许久没有更新的 Xiaorsz 同学,虽然很久没有更新了,但是就是翻翻就日志,还是能有很大收获的,这不,我一直想用的AJAX评论效果就被我发现了。
其实这个集成在 wp-threat-comment 里面,以前用嵌套评论的时候启用过一段时间,感觉还不错,至少不用刷新页面看留言效果。不过由于找不到嵌套评论的合适效果,所以决定放弃它了。但是对于AJAX评论还是耿耿于怀。
这个方法详细内容见 使用 jQuery 实现 wordpress 的 Ajax 留言 ,首先对他的辛勤劳动再次表示感谢,内容也基本取自这篇文章。
首先推荐使用 http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js ,好处就是当别人访问过同样使用这JS的时候,再次访问你的站点不用再次载入这个文件,这个文件几十K的,载入的话很耗费时间的,这自然会影响首页载入速度。
vicuna 的主题comments是需要修改的。因为他的几个关键部分不带有ID,所以如果用AJAX效果的话找不到。添加的部分主要有以下:
1、查找<span>,添加id=”commentnum”.2、查找<dl>,添加id=”commentlist”.
**第一,编写comments-ajax.php文件。**注意该部分最后的<dt id=”comment-<?php echo $comment->comment\_ID; ?>”>后的部分用自己主题的 id=”comment-<……来代替。
<?php
if ($\_SERVER\["REQUEST\_METHOD"\] != "POST") {
header('Allow: POST');
header("HTTP/1.1 405 Method Not Allowed");
header("Content-type: text/plain");
exit;
}
$db\_check = true;
function kill\_data() {
return '';
}
function check\_db() {
global $wpdb, $db\_check;
if($db\_check) {
// Check DB
if(!$wpdb->dbh) {
echo('Our database has issues. Try again later.');
} else {
echo('We\\'re currently having site problems. Try again later.');
}
die();
}
}
ob\_start('kill\_data');
register\_shutdown\_function('check\_db');
require\_once('../../../wp-config.php');
$db\_check = false;
ob\_end\_clean();
nocache\_headers();
function fail($s) {
header('HTTP/1.0 500 Internal Server Error');
echo $s;
exit;
}
$comment\_post\_ID = (int) $\_POST\['comment\_post\_ID'\];
$status = $wpdb->get\_row("SELECT post\_status, comment\_status FROM $wpdb->posts WHERE ID = '$comment\_post\_ID'");
if ( empty($status->comment\_status) ) {
do\_action('comment\_id\_not\_found', $comment\_post\_ID);
fail('The post you are trying to comment on does not currently exist in the database.');
} elseif ( 'closed' == $status->comment\_status ) {
do\_action('comment\_closed', $comment\_post\_ID);
fail('Sorry, comments are closed for this item.');
} elseif ( in\_array($status->post\_status, array('draft', 'pending') ) ) {
do\_action('comment\_on\_draft', $comment\_post\_ID);
fail('The post you are trying to comment on has not been published.');
}
$comment\_author = trim(strip\_tags($\_POST\['author'\]));
$comment\_author\_email = trim($\_POST\['email'\]);
$comment\_author\_url = trim($\_POST\['url'\]);
$comment\_content = trim($\_POST\['comment'\]);
// If the user is logged in
$user = wp\_get\_current\_user();
if ( $user->ID ) {
$comment\_author = $wpdb->escape($user->display\_name);
$comment\_author\_email = $wpdb->escape($user->user\_email);
$comment\_author\_url = $wpdb->escape($user->user\_url);
if ( current\_user\_can('unfiltered\_html') ) {
if ( wp\_create\_nonce('unfiltered-html-comment\_' . $comment\_post\_ID) != $\_POST\['\_wp\_unfiltered\_html\_comment'\] ) {
kses\_remove\_filters(); // start with a clean slate
kses\_init\_filters(); // set up the filters
}
}
} else {
if ( get\_option('comment\_registration') )
fail('请先填写个人信息再发表评论,谢谢.');
}
$comment\_type = '';
if ( get\_option('require\_name\_email') && !$user->ID ) {
if ( 6> strlen($comment\_author\_email) || '' == $comment\_author )
fail('Error: 请填写必要的信息 (name, email).');
elseif ( !is\_email($comment\_author\_email))
fail('请输入有效的Email地址.');
}
if ( '' == $comment\_content )
fail('Error: please type a comment.');
// Simple duplicate check
$dupe = "SELECT comment\_ID FROM $wpdb->comments WHERE comment\_post\_ID = '$comment\_post\_ID' AND ( comment\_author = '$comment\_author' ";
if ( $comment\_author\_email ) $dupe .= "OR comment\_author\_email = '$comment\_author\_email' ";
$dupe .= ") AND comment\_content = '$comment\_content' LIMIT 1";
if ( $wpdb->get\_var($dupe) ) {
fail('Duplicate comment detected; 你好像已经说过相同的话了!');
}
$commentdata = compact('comment\_post\_ID', 'comment\_author', 'comment\_author\_email', 'comment\_author\_url', 'comment\_content', 'comment\_type', 'user\_ID');
$comment\_id = wp\_new\_comment( $commentdata );
$comment = get\_comment($comment\_id);
if ( !$user->ID ) {
setcookie('comment\_author\_' . COOKIEHASH, $comment->comment\_author, time() + 30000000, COOKIEPATH, COOKIE\_DOMAIN);
setcookie('comment\_author\_email\_' . COOKIEHASH, $comment->comment\_author\_email, time() + 30000000, COOKIEPATH, COOKIE\_DOMAIN);
setcookie('comment\_author\_url\_' . COOKIEHASH, clean\_url($comment->comment\_author\_url), time() + 30000000, COOKIEPATH, COOKIE\_DOMAIN);
}
@header('Content-type: ' . get\_option('html\_type') . '; charset=' . get\_option('blog\_charset'));
$comment->comment\_type = 'comment';
$comment\_index = $\_POST\['comment\_count'\] + 1;
?>
<dt id="comment-<?php echo $comment->comment\_ID; ?>">
//添加自己主题评论部分的代码</dt>
**第二,comments.js的实现。**该部分当中的commentlist就是我们添加的log部分的ID。如果需要的话可以把这部分整合到自己的JS里。
if ($('#commentform').length) {
$('#commentform').submit(function(){
jQuery.ajax({
url: 'comments-ajax.php', // !这里要改为 comments-ajax.php 文件的位置
data: $('#commentform').serialize(), // 从表单中获取数据
type: 'POST', // 设置请求类型为 ‘POST’,默认为 ‘GET’
beforeSend: function() {
$('#commenterror').hide();
$('#commentload').show();
},
error: function(request) {
$('#commentload').hide();
$('#commenterror').show().html(request.responseText);
},
success: function(data) {
$('textarea').each(function(){
this.value='';
});
$('#commenterror').hide().html();
$('#comments').html(parseInt($('#comments').html()) + 1);
if (!$('#commentlist').length) {
$('#pinglist').before('<ul id="commentlist"></ul>');
}
$('#commentlist').append(data); // 追加留言数据
$('#commentform :input').attr('disabled', true);
$('#commentformbox').fadeOut(1000);
$('#commentload').hide();
setTimeout(function() { // 提交留言 15 秒后方可再次提交新留言
$('#commentform :input').removeAttr('disabled');
$('#commentformbox').fadeIn(1000);
}, 15000);
}
});
return false;
});
}
之后是评论楼层的显示,如果不想刷新后看到的话可以在success: function(data)函数体内部添加
$(‘#commentnum’).text(parseInt(jQuery(‘#commentnum’).html()) + 1);
$(‘.ajaxcomments’).text($(‘#commentnum’).text()).removeAttr(“class”);
记住commentnum是自己定义的楼层显示部分id。
第三,在footer或者header部分加载jQuery 框架和以上的JS。完成。
PS:关于里面AJAX的等待条,其实有网站可以在线生成的,在这里~~http://www.ajaxload.info/。用起来很方便喜欢的同学可以自己做一个