今早 koobai 的评论提出“什么时候写一篇点击回复之后会显示@用户名的效果日志”,刚好这两天我正在为“文囧”而“囧”,所以就把这个效果的实现方法写出来,因为我是伟大的 CP 党,所以老鸟请飘菜鸟请参考。
经常来我这的朋友都会发现我的评论回复用的是“@用户”来回复评论的,具体说明我在《启用新 WordPress 主题: zSofa ( Alpha 版本)》这篇文章里面说过,这里就不累说了。
下面只讲“用 jQuery 实现点击回复之后显示@用户名的效果”的方法步骤,同样因为我是 CP 党,所以我尽量做到贴出的代码直接 CP 就能用。
下面是详细步骤:
1. 确定自己的主题评论结构基本是 WordPress 默认的结构(也就是说主题的评论结构比较标准),而且用的是 WordPress 2.7 以上版本的 wp_list_comments 函数,具体可以参考 http://codex.wordpress.org/Template_Tags/wp_list_comments
2. 确定自己已经加载 jQuery 库,如果没有加载,在主题文件 header.php 里面找到下面这个
<?php wp_head(); ?>
在它前面加入以下代码:(注:jquery 1.3.2 一样效果)
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/reply.js"></script>
3. 把下面的 jQuery 代码保存为 reply. js 文件,并存到主题所在目录(也可以加在主题本身已有的 js 文件里面)
/* @reply js by zwwooooo */ jQuery(document).ready(function($){ //Begin jQuery $('.reply').click(function() { var atid = '"#' + $(this).parent().attr("id") + '"'; var atname = $(this).prevAll().find('cite:first').text(); $("#comment").attr("value","<a href=" + atid + ">@" + atname + " </a>").focus(); }); $('.cancel-comment-reply a').click(function() { //点击取消回复评论清空评论框的内容 $("#comment").attr("value",''); }); }) //End jQuery
4. OK 啦,可以试试了。加些说明:如果你的主题评论结构符合上面第 1 点所说,原则上支持 WordPress 2.7 版本以上的自带评论嵌套
需要了解原理的可以借助 Firebug 和 jQuery 中文手册自个折腾研究。
zww
赏
oooo
or
- 本文标题:用 jQuery 实现点击回复之后显示@用户名的效果
- 本文链接:https://zww.me/archives/24817
- 发布时间:2010年01月20日 15:34
- 版权声明:除非注明,文章均为 zwwooooo 原创,转载请以链接形式标明本文地址!
评论列表好长..另外表情很搞笑
@成 呃~表情是我修改玩儿
这个问题我也问过,好在还是在这找到了
@fcola 慢慢折腾
什么时候写个沙发,板凳,教程,成叔叔那个跟你楼号代码混合了,就不知道怎么搞了
@洁 成叔叔是谁?我不是写了楼号方法么?至于沙发板凳加个if判断楼号不就可以了?
杯具了,有木有空帮我看看 ~
我用了这个以后,先AJAX发表一次评论 ~
后一次点击回复,就没有出现 @用户名 了 ~
@小邪 喔喔,知道为什么木有@显示了 ~
因为原先的JS是无法处理AJAX返回后的数据的 ~
所以就让返回后的数据里面也带了这样的JS ~
就完工鸟 ~ 嘻嘻 ~
@小邪 哈哈,小邪应该比我懂很多js才对
刚做了主题,参考了你的代码实现的@reply,但是不知道为什么,mail to commentors这个插件再也不会发邮件了,特来请教一下,有办法解决么?谢谢!
@ZH CEXO 看看是否跟其他插件冲突
@zwwooooo 应该不会跟别的插件冲突,因为我以前使用的插件和现在使用的插件没有变化,而以前的@reply是用插件的函数实现的,这次是用js实现的,结果就有问题了
@ZH CEXO 你看我这有问题么?所以问题不在这个代码,应该是其他代码/插件引起的,用排除法测试
偶也弄好了,感谢ZWW大神啊!亲一个
@Mucid 囧,你要是女的还好
为什么我折腾半天还是不显示呢= =
willin的ajax 为什么呢为什么呢为什么呢
还有额 你的只有第二层嵌套缩进是怎么弄的呀
@snowxh 你是说2级以下的嵌套全部放在第二层?如果是的话我用的是QiQiboy的无限嵌套方法,具体去他那里吧
你是怎么做的?
IE9不支持
@blueandhack
ie9?它刚出来,不鸟它
想知道oo的嵌套回复是不是用的WP Thread Comment这个插件?
@YesCola
不是,wp原生的,wp自带何必用插件
@zwwooooo
了解,不过我还是用插件吧。。懒得折腾了。不然又要改主题。。
@YesCola
你说的是ajax回复吧,如果只是嵌套那么现在的主题都支持
貌似我的不能读取用户名和链接,郁闷,大神什么时间有时间去我那里看看
@默玉
呃,我不是大神……你注意id/class的选择,还有看看你的主题结构修改代码。打不开你的网站,超慢。
@zwwooooo
我的网站打不开?不会吧?
看来要换主机咯
把那些换来换去都读不出用户名和链接,只是独处一个UN什么的,貌似是空吧
@默玉
嗯,就是空了,找不到目标。看看自己的主题评论结构然后修改jq代码吧。
@zwwooooo
var atid = '"#' + $(this).parent().attr("id") + '"';
var atname = $(this).prevAll().find('cite:first').text();
应该是这两句吧
弱弱滴问哈,能帮俺解释下代码不?俺看不懂
@默玉
你的太多父元素了,一个parent不行,得用parents,具体翻查jquery手册
很不错~~我要折腾了~~
@Junan
慢慢折腾
好像多此一举了,每个回复你本来就在里面嵌套回复了,就不用家@了
@jafok
这主要是考虑无限嵌套后的处理,或者同一层楼讨论过多不至于混乱,多此一举会鲜明很多。
我现在能取到id,娶不到name,不知道是改怎么选择。
@闲云野鹤
现在搞定没有啊?
@zwwooooo
现在搞定了,不过又有棘手的问题了,太郁闷了。
@闲云野鹤
折腾不断,哈哈
@zwwooooo
测试下
@闲云野鹤
这个可以有几个?
@zwwooooo 还是有点纳闷,为什么回复的时候,评论不会超过两层?是你后台设置的不超过2层吗?如果是那样,可是那个第二层的回复按钮是怎么生成的? 求解
@。潇
不是,我主题的评论代码我限制了。
你好,我想问一下,我用了你的代码,取消回复后评论框里还是有新添加的@作者,怎么回事呢,我模版用的wp_list_comments
@Alex
这个问题解决了,有个新问题:就是@alex后面有7个空格,我把JS里的空格去掉了还有7个。
@Alex
因为你的cite里面有图片,不单是评论者名。把comment-info-detector插件的信息移开到其他地方
@zwwooooo
谢谢啊!
@zwwooooo
有个问题啊,我的评论是调用WP默认的,就一条函数:
咋整啊!
@zwwooooo
对不起,刚才发的那条函数没发出来:《?php wp_list_comments();?》
@Alex
一样的,分析一下结构就可以了
学习了~
顺便试一试你的评论效果噢...
@陨落de芳菲
感觉怎么样?
我直接到你的JS合并放到我已加载过的JS里毫无反应
@yesureadmin
注意自己主题的html结构
我怎么从哪都是搜索到你的网页
@solazy
那就先我这找找,找不到才去搜吧,哈
刚刚试了一下,第6行可以这样改:
改成 \n
然后把前面的空格删除掉
这样应该比较完美吧
@solazy
\n是换行,这个看需求了,有人喜欢名字后面接着评论
大叔,我那里@了之后,没有评论ID和评论者的名称,像这样“@ ”,怎么回事呢?
忘记HTML不能直接贴了
贴图
@liveme 不支持贴图?? …………
@liveme
说明你的评论结构不是WP默认那种,你要根据你的主题结构调整jQuery的选择器。
@zwwooooo
我是也是这情况 是3.2的默认主题 不知道怎么改呢?
@球犯
要稍微懂点jQuery的选择器
@zwwooooo
不懂。。自己瞎折腾一下试试。。