点击生成评论引用的jQuery代码

题外话:这几天一直在折腾Ajax评论提交,走了一个大圈还是回到了原点:willin的Ajax评论提交方式。不过算是了解了,可以自己升级修改了,精简了一些不必要的功能加快评论速度,再改改一些效果……麻烦大家继续测试ing

好,进入正题:这篇文章所说的内容其实对于熟悉jQuery的朋友来说非常简单,但因为有人要,就贴出来,顺便解决一下即将来临的文囧。

前提

1. 挂 jQuery 库,如果没有挂就把下面的js调用扔到 header.php 里面的 <?php wp_head() ?> 前面

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

2. 使用标准的评论结构,参考 WordPress 官方 http://codex.wordpress.org/Function_Reference/wp_list_comments 的 Examples 部分

准备

在functions.php找到主题的回调函数,找到类似下面的

<div class="reply">
	<?php comment_reply_link(array_merge( $args, array('depth' => $depth, 'max_depth' => $args['max_depth']))) ?>
</div>

复制一份稍微修改一下,变成如下

<div class="reply">
	<?php comment_reply_link(array_merge( $args, array('depth' => $depth, 'max_depth' => $args['max_depth']))) ?>
</div>
<div class="quote">
	<?php comment_reply_link(array_merge( $args, array('depth' => $depth, 'max_depth' => $args['max_depth']))) ?>
</div>

注:你可能还需要修改 quote 显示样式css,最简单的就是在 .reply 上加上一个 .quote,自个折腾

jQuery代码:(把下面的添加到你的js文件或者直接加到footer.php的<?php wp_foot() ?>后面,用<script type="text/javascript"></script>引用)

2010.8.28 Edit)漏一句jQ代码,为复制的reply按钮文字换为“quote”

//评论引用 by zwwooooo
jQuery(".quote a").text("quote");//替换复制的reply按钮文字为quote
jQuery('.quote').click(function() {
	var atname = jQuery(this).parent().find('cite:first').text();//获得作者名称
	var quotecontent = jQuery(this).parent().find('.comment-content:first').html();//获得评论内容
	jQuery("#comment").attr("value","<blockquote><strong>" + atname + ": </strong>" + quotecontent + "</blockquote>\n").focus();//组合成引用
});

如果你要带@xxx的就如下:

//评论引用 by zwwooooo
jQuery(".quote a").text("quote");//替换复制的reply按钮文字为quote
jQuery('.quote').click(function() {
	var atid = '"#' + jQuery(this).parent().attr("id") + '"';//获取评论ID
	var atname = jQuery(this).parent().find('cite:first').text();//获得作者名称
	var quotecontent = jQuery(this).parent().find('.comment-content:first').html();//获得评论内容
	jQuery("#comment").attr("value","<a href=" + atid + ">@" + atname + " </a>\n" + "<blockquote><strong>" + atname + ": </strong>" + quotecontent + "</blockquote>\n").focus();//组合成引用
});

有些主题比较特殊,也就是说自定义了评论结构,那么就要根据自个主题修改 jQ 选择器了,不懂可以翻翻 jQuery 手册。

就这样,有兴趣的慢慢折腾。

zww
or
oooo

“点击生成评论引用的jQuery代码”有143条评论

  1. BoKeam says:

    占沙发

  2. BoKeam says:

    速度好快 :shock: 看看代码

    1. zwwooooo says:

      @BoKeam 看不到,压缩了……

  3. 哲哲 says:

    从twitter过来的·不过有点慢了··

    1. zwwooooo says:

      @哲哲 貌似feedburner订阅的快,因为发表文章-》feedburner-》twitter

    2. BoKeam says:

      @zwwooooo 你错了.我是恰好到这找东西.恰好你更新了,虽然我也是用FB订了 :mrgreen:

    3. zwwooooo says:

      @BoKeam 哈哈,最快的就是突然跑进博客然后刚好新发表一篇文章

  4. BoKeam says:

    Z大.Willin Kan的新版 Gravatar 緩存.他下面说的
    注意: 因為這方法是掛在 get_avatar() 後面, 所以必須在 get_avatar() 定義 $default,
    例: echo get_avatar( $id_or_email, $size = '42', $default = get_bloginfo('wpurl') . '/avatar/default.jpg' );
    其中 $id_or_email 的部份要看你模板怎麼寫, 後面的 $default 所帶的就是默認頭像.
    我没改怎么也可以?我直接把那段代码放functions.php里了

    1. zwwooooo says:

      @BoKeam 不需要定义,删了即可 my_avatar($id_or_email, $size = '42')

    2. BoKeam says:

      @zwwooooo 我什么都没改.没问题就行了.慢慢就明白了

    3. zwwooooo says:

      @BoKeam 因为函数默认已经定义好了$default = get_bloginfo('wpurl') . '/avatar/default.jpg'

  5. Jinwen says:

    这个挺有用的。就是不知道使用起来的频率高不高。

    1. 球犯 says:

      @Jinwen

      Jinwen: 这个挺有用的。就是不知道使用起来的频率高不高。

      我也来试试引用~

    2. zwwooooo says:

      @Jinwen 频率肯定不高,除非有很多讨论的博客

  6. 阿修 says:

    我感觉使用频率不会很高啊,很多主题已经有嵌套评论了。

    1. BoKeam says:

      @阿修 引用我也觉得使用少..

    2. zwwooooo says:

      @阿修 其实没考虑频率,自己的早加上了,玩儿

  7. 球犯 says:

    现在Ajax评论提交比上次好多了~ 没有那种突兀感了~

    1. Armgod says:

      试试看

    2. zwwooooo says:

      @球犯 哈哈,我现在又改了下,其实我喜欢突击

    3. cho says:

      @球犯

      球犯: 现在Ajax评论提交比上次好多了~ 没有那种突兀感了~

      试试看吧……

    4. zwwooooo says:

      @Armgod 感觉咋样?

    5. Armgod says:

      @zwwooooo 是错觉么,我觉得比昨天快

    6. zwwooooo says:

      @Armgod 我改了动画,昨天有点拖拉

    7. zwwooooo says:

      @cho 感觉怎样呢?

    8. Armgod says:

      @zwwooooo 刷屏王子,你回复的太快了…

    9. 木本无心 says:

      @zwwooooo

      zwwooooo: 哈哈,我现在又改了下,其实我喜欢突击

      我来拿你做个试验。

    10. zwwooooo says:

      @木本无心

      木本无心:

      zwwooooo: 哈哈,我现在又改了下,其实我喜欢突击

      我来拿你做个试验。

      我再试验回你

    11. zwwooooo says:

      @Armgod 嘿嘿,我刚好在回复嘛

    12. cho says:

      @zwwooooo

      这样可以让页面里播放的音乐不会在评论后被中断……哈哈

    13. zwwooooo says:

      @cho 一般音乐类/flash类的博客最好用ajax提交

  8. 讲得很细,很好理解

  9. Ygs says:

    测试

    1. zwwooooo says:

      @Ygs 测试报告嗯?

    2. Ygs says:

      @zwwooooo 读取图片头尾一个,真多

    3. zwwooooo says:

      @Ygs 玩玩呗

  10. snowxh says:

    lol感动!
    我再去折腾折腾...

    1. zwwooooo says:

      @snowxh 文章里面的就是你了 :grin:

    2. snowxh says:

      @zwwooooo 没折腾出来!求叔叔帮忙检查源码lol
      另外这样怎么把“回复”变成“引用”额

    3. zwwooooo says:

      @snowxh 不好意思,我漏了一句jQ代码,已经更正,如果要显示“引用”,就把新加的
      jQuery(".quote a").text("quote");
      改为
      jQuery(".quote a").text("引用");

    4. snowxh says:

      @zwwooooo 成功啦\(^o^)/

    5. zwwooooo says:

      @snowxh 哈哈,恭喜

  11. A.shun says:

    还是jq的好。。既然加载了jq的话。

    又折腾回来了- -

    1. zwwooooo says:

      @A.shun 嘿嘿,不过我精简了,嘿嘿

  12. 闫头 says:

    一头雾水啊。。。。

    1. zwwooooo says:

      @闫头 这个……需要折腾

  13. 木本无心 says:

    测试完毕,结果这个pj的引用是一样一样地。

    1. zwwooooo says:

      @木本无心 pj没用过,不太喜欢它的评论方式

  14. ifenwen says:

    等换个主题再折腾 目前这个主题连 ajax 都不行的

    1. zwwooooo says:

      @ifenwen 为啥不行呢?修改一下应该行的

    2. ifenwen says:

      @zwwooooo 修改了些代码 具体也搞不清楚 主要是主题的原作者也没有折腾好 加上我的一些修改 算是彻底搞不定了

    3. zwwooooo says:

      @ifenwen 囧,是改糊涂了……

  15. 两头雾水 :shock:

    1. zwwooooo says:

      @书香阁免费网 如果折腾了就3头清水

  16. dengmin says:

    我发现我越来越讨厌php了.逻辑代码和html交杂在一块.看的脑袋一热一热的

    1. zwwooooo says:

      @dengmin 看多了就懂了,最好用括号

  17. 表示折腾不起。

    1. zwwooooo says:

      @❤•终于° 这……其实也不是复杂……

    2. @zwwooooo 主题不标准,层次相当混乱。

    3. zwwooooo says:

      @❤•终于° 那自己发功夫修正它

  18. mice says:

    我是来看提交速度的..

  19. mice says:

    哇擦 秒发??再来个..

    1. zwwooooo says:

      @mice 嘻嘻,主机状态好的情况下是秒杀!

  20. mice says:

    留名 这个我估计我会用的 :evil:

    1. zwwooooo says:

      @mice 需要就折腾下,很简单的

发表评论

昵称 *

网址

B em del U Link Code Quote