WordPress ajax评论回复功能实现方法

第一,将comments-ajax.js 及 comments-ajax.php 放在你所使用主题的文件夹内;

comments-ajax.js

 代码如下 复制代码

var i = 0, got = -1, len = document.getElementsByTagName('script').length;
while ( i <= len && got == -1){
 var js_url = document.getElementsByTagName('script')[i].src,
   got = js_url.indexOf('comments-ajax.js'); i++ ;
}
var edit_mode = '1', // 再??模式 ( '1'=?; '0'=不? )
  ajax_php_url = js_url.replace('-ajax.js','-ajax.php'),
  wp_url = js_url.substr(0, js_url.indexOf('wp-content')),
  pic_sb = wp_url + 'wp-admin/images/wpspin_dark.gif', // 提交 icon
  pic_no = wp_url + 'wp-admin/images/no.png',      // ?? icon
  pic_ys = wp_url + 'wp-admin/images/yes.png',     // 成功 icon
  txt1 = '<div id="loading"><img src="' + pic_sb + '" style="vertical-align:middle;" alt=""/> 正在提交, ?稍候...</div>',
  txt2 = '<div id="error">#</div>',
  txt3 = '"><img src="' + pic_ys + '" style="vertical-align:middle;" alt=""/> 提交成功',
  edt1 = ', 刷新页面之前可以<a rel="nofollow" class="comment-reply-link" href="#edit" onclick='return addComment.moveForm("',
  edt2 = ')'>再编辑</a>',
  cancel_edit = '取消编辑',
  edit, num = 1, comm_array=[]; comm_array.push('');

jQuery(document).ready(function($) {
  $comments = $('#comments-title'); // ???档 ID
  $cancel = $('#cancel-comment-reply-link'); cancel_text = $cancel.text();
  $submit = $('#commentform #submit'); $submit.attr('disabled', false);
  $('#comment').after( txt1 + txt2 ); $('#loading').hide(); $('#error').hide();
  $body = (window.opera) ? (document.compatMode == "CSS1Compat" ? $('html') : $('body')) : $('html,body');

/** submit */
$('#commentform').submit(function() {
  $('#loading').slideDown();
  $submit.attr('disabled', true).fadeTo('slow', 0.5);
  if ( edit ) $('#comment').after('<input type="text" name="edit_id" id="edit_id" value="' + edit + '" style="display:none;" />');

/** Ajax */
 $.ajax( {
  url: ajax_php_url,
  data: $(this).serialize(),
  type: $(this).attr('method'),

  error: function(request) {
   $('#loading').slideUp();
   $('#error').slideDown().html('<img src="' + pic_no + '" style="vertical-align:middle;" alt=""/> ' + request.responseText);
   setTimeout(function() {$submit.attr('disabled', false).fadeTo('slow', 1); $('#error').slideUp();}, 3000);
   },

  success: function(data) {
   $('#loading').hide();
   comm_array.push($('#comment').val());
   $('textarea').each(function() {this.value = ''});
   var t = addComment, cancel = t.I('cancel-comment-reply-link'), temp = t.I('wp-temp-form-div'), respond = t.I(t.respondId), post = t.I('comment_post_ID').value, parent = t.I('comment_parent').value;

// comments
  if ( ! edit && $comments.length ) {
   n = parseInt($comments.text().match(/d+/));
   $comments.text($comments.text().replace( n, n + 1 ));
  }

// show comment
  new_htm = '" id="new_comm_' + num + '"></';
  new_htm = ( parent == '0' ) ? ('n<ol style="clear:both;" class="commentlist' + new_htm + 'ol>') : ('n<ul class="children' + new_htm + 'ul>');

  ok_htm = 'n<span id="success_' + num + txt3;
  if ( edit_mode == '1' ) {
   div_ = (document.body.innerHTML.indexOf('div-comment-') == -1) ? '' : ((document.body.innerHTML.indexOf('li-comment-') == -1) ? 'div-' : '');
   ok_htm = ok_htm.concat(edt1, div_, 'comment-', parent, '", "', parent, '", "respond", "', post, '", ', num, edt2);
  }
  ok_htm += '</span><span></span>n';

  $('#respond').before(new_htm);
  $('#new_comm_' + num).hide().append(data);
  $('#new_comm_' + num + ' li').append(ok_htm);
  $('#new_comm_' + num).fadeIn(4000);

  $body.animate( { scrollTop: $('#new_comm_' + num).offset().top - 200}, 900);
  countdown(); num++ ; edit = ''; $('*').remove('#edit_id');
  cancel.style.display = 'none';
  cancel.onclick = null;
  t.I('comment_parent').value = '0';
  if ( temp && respond ) {
   temp.parentNode.insertBefore(respond, temp);
   temp.parentNode.removeChild(temp)
  }
  }
 }); // end Ajax
  return false;
}); // end submit

/** comment-reply.dev.js */
addComment = {
 moveForm : function(commId, parentId, respondId, postId, num) {
  var t = this, div, comm = t.I(commId), respond = t.I(respondId), cancel = t.I('cancel-comment-reply-link'), parent = t.I('comment_parent'), post = t.I('comment_post_ID');
  if ( edit ) exit_prev_edit();
  num ? (
   t.I('comment').value = comm_array[num],
   edit = t.I('new_comm_' + num).innerHTML.match(/(comment-)(d+)/)[2],
   $new_sucs = $('#success_' + num ), $new_sucs.hide(),
   $new_comm = $('#new_comm_' + num ), $new_comm.hide(),
   $cancel.text(cancel_edit)
  ) : $cancel.text(cancel_text);

  t.respondId = respondId;
  postId = postId || false;

  if ( !t.I('wp-temp-form-div') ) {
   div = document.createElement('div');
   div.id = 'wp-temp-form-div';
   div.style.display = 'none';
   respond.parentNode.insertBefore(div, respond)
  }

  !comm ? (
   temp = t.I('wp-temp-form-div'),
   t.I('comment_parent').value = '0',
   temp.parentNode.insertBefore(respond, temp),
   temp.parentNode.removeChild(temp)
  ) : comm.parentNode.insertBefore(respond, comm.nextSibling);

  $body.animate( { scrollTop: $('#respond').offset().top - 180 }, 400);

  if ( post && postId ) post.value = postId;
  parent.value = parentId;
  cancel.style.display = '';

  cancel.onclick = function() {
   if ( edit ) exit_prev_edit();
   var t = addComment, temp = t.I('wp-temp-form-div'), respond = t.I(t.respondId);

   t.I('comment_parent').value = '0';
   if ( temp && respond ) {
    temp.parentNode.insertBefore(respond, temp);
    temp.parentNode.removeChild(temp);
   }
   this.style.display = 'none';
   this.onclick = null;
   return false;
  };

  try { t.I('comment').focus(); }
  catch(e) {}

  return false;
 },

 I : function(e) {
  return document.getElementById(e);
 }
}; // end addComment

function exit_prev_edit() {
  $new_comm.show(); $new_sucs.show();
  $('textarea').each(function() {this.value = ''});
  edit = '';
}

var wait = 15, submit_val = $submit.val();
function countdown() {
 if ( wait > 0 ) {
  $submit.val(wait); wait--; setTimeout(countdown, 1000);
 } else {
  $submit.val(submit_val).attr('disabled', false).fadeTo('slow', 1);
  wait = 15;
  }
}

});// end jQ

comments-ajax.php

 代码如下 复制代码

<?php
/**
 * WordPress ?戎们短自u??S Ajax comments >> WordPress-jQuery-Ajax-Comments v1.3 by Willin Kan.
 * www.111cn.net
 * ?明: ???文件是由 WP 3.0 根目?的 wp-comment-post.php 修改的, 修改的地方有注解. ? WP 升?, ?注意可能有所不同.
 */

if ( 'POST' != $_SERVER['REQUEST_METHOD'] ) {
 header('Allow: POST');
 header('HTTP/1.1 405 Method Not Allowed');
 header('Content-Type: text/plain');
 exit;
}

/** Sets up the WordPress Environment. */
require( dirname(__FILE__) . '/../../../wp-load.php' ); // 此 comments-ajax.php 位於主??料?A,所以位置已不同

nocache_headers();

$comment_post_ID = isset($_POST['comment_post_ID']) ? (int) $_POST['comment_post_ID'] : 0;

$post = get_post($comment_post_ID);

if ( empty($post->comment_status) ) {
 do_action('comment_id_not_found', $comment_post_ID);
 err(__('Invalid comment status.')); // ? exit 改?殄e?提示
}

// get_post_status() will get the parent status for attachments.
$status = get_post_status($post);

$status_obj = get_post_status_object($status);

if ( !comments_open($comment_post_ID) ) {
 do_action('comment_closed', $comment_post_ID);
 err(__('Sorry, comments are closed for this item.')); // ? wp_die 改?殄e?提示
} elseif ( 'trash' == $status ) {
 do_action('comment_on_trash', $comment_post_ID);
 err(__('Invalid comment status.')); // ? exit 改?殄e?提示
} elseif ( !$status_obj->public && !$status_obj->private ) {
 do_action('comment_on_draft', $comment_post_ID);
 err(__('Invalid comment status.')); // ? exit 改?殄e?提示
} elseif ( post_password_required($comment_post_ID) ) {
 do_action('comment_on_password_protected', $comment_post_ID);
 err(__('Password Protected')); // ? exit 改?殄e?提示
} else {
 do_action('pre_comment_on_post', $comment_post_ID);
}

$comment_author       = ( isset($_POST['author']) )  ? trim(strip_tags($_POST['author'])) : null;
$comment_author_email = ( isset($_POST['email']) )   ? trim($_POST['email']) : null;
$comment_author_url   = ( isset($_POST['url']) )     ? trim($_POST['url']) : null;
$comment_content      = ( isset($_POST['comment']) ) ? trim($_POST['comment']) : null;
$edit_id              = ( isset($_POST['edit_id']) ) ? $_POST['edit_id'] : null; // 提取 edit_id

// If the user is logged in
$user = wp_get_current_user();
if ( $user->ID ) {
 if ( empty( $user->display_name ) )
  $user->display_name=$user->user_login;
 $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') || 'private' == $status )
  err(__('Sorry, you must be logged in to post a comment.')); // ? wp_die 改?殄e?提示
}

$comment_type = '';

if ( get_option('require_name_email') && !$user->ID ) {
 if ( 6 > strlen($comment_author_email) || '' == $comment_author )
  err( __('Error: please fill the required fields (name, email).') ); // ? wp_die 改?殄e?提示
 elseif ( !is_email($comment_author_email))
  err( __('Error: please enter a valid email address.') ); // ? wp_die 改?殄e?提示
}

if ( '' == $comment_content )
 err( __('Error: please type a comment.') ); // ? wp_die 改?殄e?提示

// 增加: ??提示功能
function err($ErrMsg) {
    header('HTTP/1.1 405 Method Not Allowed');
    echo $ErrMsg;
    exit;
}

// 增加: ?z查重覆??功能
$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) ) {
    err(__('Duplicate comment detected; it looks as though you’ve already said that!'));
}

// 增加: ?z查??太快功能
if ( $lasttime = $wpdb->get_var( $wpdb->prepare("SELECT comment_date_gmt FROM $wpdb->comments WHERE comment_author = %s ORDER BY comment_date DESC LIMIT 1", $comment_author) ) ) {
$time_lastcomment = mysql2date('U', $lasttime, false);
$time_newcomment  = mysql2date('U', current_time('mysql', 1), false);
$flood_die = apply_filters('comment_flood_filter', false, $time_lastcomment, $time_newcomment);
if ( $flood_die ) {
    err(__('You are posting comments too quickly.  Slow down.'));
 }
}

$comment_parent = isset($_POST['comment_parent']) ? absint($_POST['comment_parent']) : 0;

$commentdata = compact('comment_post_ID', 'comment_author', 'comment_author_email', 'comment_author_url', 'comment_content', 'comment_type', 'comment_parent', 'user_ID');

// 增加: ?z查??是否正被??, 更新或新建??
if ( $edit_id ){
$comment_id = $commentdata['comment_ID'] = $edit_id;
wp_update_comment( $commentdata );
} else {
$comment_id = wp_new_comment( $commentdata );
}

$comment = get_comment($comment_id);
if ( !$user->ID ) {
 $comment_cookie_lifetime = apply_filters('comment_cookie_lifetime', 30000000);
 setcookie('comment_author_' . COOKIEHASH, $comment->comment_author, time() + $comment_cookie_lifetime, COOKIEPATH, COOKIE_DOMAIN);
 setcookie('comment_author_email_' . COOKIEHASH, $comment->comment_author_email, time() + $comment_cookie_lifetime, COOKIEPATH, COOKIE_DOMAIN);
 setcookie('comment_author_url_' . COOKIEHASH, esc_url($comment->comment_author_url), time() + $comment_cookie_lifetime, COOKIEPATH, COOKIE_DOMAIN);
}

//$location = empty($_POST['redirect_to']) ? get_comment_link($comment_id) : $_POST['redirect_to'] . '#comment-' . $comment_id; //取消原有的刷新重定向
//$location = apply_filters('comment_post_redirect', $location, $comment);

//wp_redirect($location);

$comment_depth = 1;   //为评论的 class 属性准备的
$tmp_c = $comment;
while($tmp_c->comment_parent != 0){
$comment_depth++;
$tmp_c = get_comment($tmp_c->comment_parent);
}

//以下是??式?? 不含 "回覆". 要用你模板的式? copy 覆?.
?>
 <li <?php comment_class(); ?> id="li-comment-<?php comment_ID(); ?>">
  <div id="comment-<?php comment_ID(); ?>">
  <div class="comment-author vcard">
   <?php echo get_avatar( $comment,$size='40',$default='<path_to_url>' ); ?>
   <?php printf( __( '<cite class="fn">%s</cite> <span class="says">says:</span>'), get_comment_author_link() ); ?>
  </div>
  <?php if ( $comment->comment_approved == '0' ) : ?>
   <em><?php _e( 'Your comment is awaiting moderation.' ); ?></em>
   <br />
   
  <?php endif; ?>

  <div class="comment-meta commentmetadata"><a href="<?php echo esc_url( get_comment_link( $comment->comment_ID ) ); ?>"><?php printf( __( '%1$s at %2$s' ), get_comment_date(),  get_comment_time() ); ?></a><?php edit_comment_link( __( '(Edit)' ), ' ' ); ?></div>

  <div class="comment-body"><?php comment_text(); ?></div>

 </div>

第二,在主题文件夹中打开header.php,找到:

 代码如下 复制代码

<?php if ( is_singular() ) wp_enqueue_script( ‘comment-reply’ ); ?>

修改为:

<?php if ( is_singular() ){ ?>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js”></script>
<script type=”text/javascript” src=”<?php bloginfo(‘template_directory’); ?>/comments-ajax.js”></script>
<?php } ?>

好了,就是这么简单。清除缓存,刷新。

时间: 2024-09-13 09:53:40

WordPress ajax评论回复功能实现方法的相关文章

mysql-如何建立评论回复功能的表结构?

问题描述 如何建立评论回复功能的表结构? 例如图中的的回复,我在数据库里应该建立哪些字段呢? 求大神科普~ 解决方案 一般要有 主题(回答)的外键.回复者.回复时间.回复内容.序号.

PHP+AJAX实现投票功能的方法_php实例

本文实例讲述了PHP+AJAX实现投票功能的方法.分享给大家供大家参考.具体如下: 在这个 AJAX 实例中,我们将演示一个投票程序,网页在不重新加载的情况下,就可以获得结果. 本例包括四个元素: ① HTML 表单 ② JavaScript ③ PHP 页面 ④ 存放结果的文本文件 一.HTML 表单 这是 HTML 页面.它包含一个简单的 HTML 表单,以及一个与 JavaScript 文件的连接: <html> <head> <script src="pol

WordPress中利用AJAX异步获取评论用户头像的方法_javascript技巧

在评论者输入邮箱后,异步获得评论者的头像并显示出来,个人感觉这个功能虽不能给用户体验带来多大的提升,也不算是一个实用的功能,但至少很炫,看到有的网站有添加这个功能,我也不甘寂寞所以也写了个脚本,没有时间做封装,所以直接上原理和代码. 异步动态调用头像原理 获得用户输入 过滤用户输入 传递变量到后台 后台处理数据,并返回头像的HTML代码 获得后台返回数据,将HTML代码加载到当前页面 貌似很多步骤,其实很简单,我们只要将自己的主题稍作修改就可以到达效果. 简单功能截图: 实现 功能代码:Java

wordpress修改评论默认头像方法

wordpress默认评论头像的修改方法: 1.将头像文件保存在主题文件夹下的images文件夹中,命名为man.jpg: 2.在functions.php文件中加入如下代码:  代码如下 复制代码 add_filter( 'avatar_defaults', 'custom_gravatar' ); function custom_gravatar($avatar_defaults) {  $myavatar = get_bloginfo('template_url') . '/images/

评论回复布局-类似微信朋友圈的评论布局问题

问题描述 类似微信朋友圈的评论布局问题 要实现类似微信朋友圈的评论回复功能,目前通过嵌套listview已经基本实现了布局的显示功能,现在要实现点击某条评论,弹出输入框和输入法,且输入框的位置正好在点击的评论的正下方,毛事要动态的移动listview里面item的位置.看了下微信朋友圈和手机QQ的空间都是如此实现的,想问问,有没有有具体点的思路. 目前想到的难点如下: 1.listview里面的刚好占满一个屏幕,点击最后的一个item,如何将该item提升到输入法和输入框的上面,listview

怎样用ASP.NET做出QQ控件类似的评论回复

问题描述 如何在展示的每条评论下再展示出每个评论的回复,并且每条评论下还有可以回复的按钮,每条回复还可以再回复,就类似QQ空间的评论回复功能.希望可以有代码的参考.邮箱:2270967944@qq.com.谢谢大家! 解决方案 解决方案二:设计评论表就行了吧解决方案三:我有,用mvc做的一个例子..解决方案四:已经发到你的邮箱,希望对你有所帮助..解决方案五:引用2楼u013907025的回复: 我有,用mvc做的一个例子.. 谢谢,这几天忘记了,还没来得及看,多谢分享啊~~~解决方案六:766

php+mysql结合Ajax实现点赞功能完整实例_php技巧

本文实例讲述了php+mysql结合Ajax实现点赞功能的方法.分享给大家供大家参考.具体如下: 要实现点赞功能,有多种实现方式,这里总结一下利用Ajax,php和mysql来实现点赞的数据的功能.具体步骤如下: 一.页面中的HTML代码部分: <span>0</span> <button onclick="goodplus(1);">good+1</button> <span>0</span> <butto

WordPress中Ajax评论分页实现方法

一.准备 加载 jQuery 库,这个不解释了.  二.开启 WordPress 评论分页 打开 WordPress 后台 – 设置 – 讨论,在"其他评论设置"中勾选分页显示评论,设置一下评论数目,这里的评论数目仅计算主评论,回复评论不作计算.这里 Kayo 填了比较大的数字(15),因为评论分页分得太细会使用户不便于阅读之前的评论.  在后台开启评论分页后,在 comments.php 中需要添加分页导航的地方加入以下代码(如主题中有类似代码则无须再添加,另外代码中的 nav 标签

WordPress Ajax 提交评论的实现思路与方法

 虽说现在访问量一直比较低,不存在服务器压力的问题,但一向注重用户体验的我,当然不能放弃这么一个提升用户体验的机会.今天抽了一下午的空,把这个主题的 Ajax 评论提交初步完成了. 直接开门见山,直接上代码:(原理及思路在最后) 根据自己主题不同结构,以下代码请自行调整. WordPress Ajax 提交评论 PHP 代码 在主题 function.php 文件中加入如下部分.  代码如下 复制代码 //以下大部分代码出自 yinheli 经由该部分代码,排除部分错误.优化精简得出以下代码.