kn007的个人博客
♥ You are here: Home > 软件与网络 > php > 跨文章跨页面悬浮显示@评论

跨文章跨页面悬浮显示@评论

by | 67 Comments

提醒:本文最后更新于 4058 天前,文中所描述的信息可能已发生改变,请仔细核实。

上一个帖子的评论中,提到了跨文章跨页面悬浮显示 @ 评论支持(悬浮本文字可见效果)和新的自动@函数(修改了过滤器对象)。

先来说自动@函数,大发采用的还是前人写的通过comment_text过滤器校验。

a8sd723ddf642a1574do这个过滤器对于sidebar(边栏)的最近评论,还有常用的wp_mail_notify(邮件提醒)都没有效果,因为这两样通常采用get_comment的方式,而且comment_text最终也是需要走get_comment的,所以把过滤对象换为get_comment。

具体函数,丢到functions.php替代老的@函数即可。

add_filter('get_comment', 'get_comment_add_at_parent');
function get_comment_add_at_parent($comment){
	global $wpdb;
	if ($comment->comment_parent) {
		$parent_comment = get_comment($comment->comment_parent);
		$comment->comment_content  = preg_replace('/<a href="#comment-([0-9]+)?".*?>(.*?)<\/a>:/i','',$comment->comment_content);//去除存在数据库里的@回复
		$comment->comment_content   = '<a href="#comment-' . $comment->comment_parent . '" class="atreply" rel="nofollow">@' . $parent_comment->comment_author . '</a>: ' . $comment->comment_content;
	}
	return $comment;
}

说实在的,我不大喜欢这个函数,因为我觉得这个不大好,需要进行preg_replace替换数据库存有的@内容,浪费性能,虽说性能不值几个钱。

或许有人会说,自己本身数据库是没有@的。但是从你使用该函数后,如果你在后台编辑评论的话,编辑框是会有@的,当你编辑成功时,数据库就附带at了,如果这时不preg_replace就会有双at了。所以到头来,因为各种可能,preg_replace是必须的。

虽然我现在也启用了,但后续的,我可能还是用回传统的js添加法,评论时难看就难看吧。好歹搬家也能有个底。

说这么多,对于跨文章跨页面悬浮显示 @ 评论,一开始我对老杨说的思路就错了,想复杂了。在搞上面的过滤器时,想起直接用get_comment配合ajax就可以直接获取了。

首先在functions.php中添加如下代码,请根据需要修改。

add_action('init', 'load_comment_ajax');
function load_comment_ajax(){
    if( isset($_GET['action']) && $_GET['action'] == 'ajax_load_comment' && isset($_GET['cmid']) ){
        nocache_headers();
        $comment = get_comment($_GET['cmid']);
        if(!$comment) die();
        lopercomment($comment, null,null);//评论钩子方法自己改成自己主题的
        die();
    }
}

js方面,为了使兼容性更好,方便各位复制后可直接使用,我采用了读取评论时,自动对@评论不存在的请求出来(隐藏在评论列表末尾)。这样的话,不用改变现有显示@的函数,就可以实现跨页面悬浮显示 @ 评论了。

js片段如下,加在适当的位置,确保读取分页评论也能得到重建。

		$('.atreply').each(function(f){
			var __atreplyid = $(this).attr('href');
			if(!$(__atreplyid).is('.comment')) {
				var cmid = __atreplyid.slice(9);
				$.ajax({
					url: home_url + "?action=ajax_load_comment&cmid=" + cmid,
					type: 'GET',
					dataType: 'html',
					success: function(data) {
						var AtCommentLoad = $(data + '</li>');
						AtCommentLoad.hide().appendTo($('#thecomments'));
					}
				});
			}
		});

特别提示,因为我定义了$即为jQuery,如果你不是采用相同方法,请将$替换为jQuery。

另外这种JQ请求方式,支持JQ大多数版本,兼容低版本JQ。

改进地方也有,就是鼠标悬停再ajax请求,这样可以节省请求。不过目前这样,体验比较好。

还有就是因为自己现有主题的js比较乱,所以文章正文暂显示不出来at的内容,如果你的原始显示at内容的js处理的比较好,以上代码,就可显示出来了。

文章正文的引用已经可以显示出来了,详细将鼠标悬停于此见效果。

好了,说到这里就不啰嗦太多了,工作上还比较忙。以上内容不提供各种帮助或解答,请自行参考学习,谢谢。(这些功能可能随时被取消)

另外,文章同步微博因CVE-2015-4024而导致的方法失效,已经更新为新方法(换了个接口而已,再次偷懒没使用multipart请求)。貌似已经正常工作了。还有拖了1年多的loper评论嵌套错位问题也解决了,貌似还有点小bug,回头再看看了。

转载请注明转自: kn007的个人博客 的《跨文章跨页面悬浮显示@评论

donate
有所帮助?
Comments
67 Comments立即评论
  1. MOD回复

    示例:文中提到的我之前对老杨说的思路,鼠标悬停可见效果。

    1. @kn007: 看到跨页的效果了 :lol:

    2. MOD回复

      @World: 说实在的,这功能没什么用,感觉。。

    3. LV5回复

      @kn007: 我也觉得,一般很少用到吧。第二层评论开始不管是第几层都按第二层算,回复后的在后,这个更实用,哈哈。

    4. MOD回复

      @老杨: 我这种就无所谓,因为没有层次的。你的那种最好还是跟大发一样,他那个是主题自带的记得是

    5. LV5回复

      @kn007: 我的还没实现呢,出来 bug 了?鼠标拿开那个显示的悬浮评论不会消失了。

    6. MOD回复

      @老杨: 调试

    7. MOD回复

      @老杨: 文章正文也支持评论显示了

    8. LV5回复

      @kn007: 折腾得真是快。刚放上去的时候会闪一闪。

    9. MOD回复

      @老杨: js效果所致,懒得搞了

    10. @kn007: 也有一定的用 很方便 却又好像麻烦点 得写出评论层数 #comment-

    11. MOD回复

      @World: 使用get_comment_add_at_parent函数就会自动附上

    12. @kn007: 我的意思是像你示例的第一条评论那样的跨页 :lol: 嘿嘿

    13. MOD回复

      @World: 那这个没办法,所以这个功能最好用在文章正文,晚点就会实现

    14. MOD回复

      @World: 文章正文也支持评论显示了,你可以看看。还是那句话,感觉没什么意思。。。

    15. @kn007: 那还是不要加了 太多效果也影响体验的

    16. LV5回复

      @kn007: 我也把过滤对象换为get_comment了,我虽然没有侧栏,不过有邮件通知 :lol:

    17. MOD回复

      @老杨: 了解

  2. 自己把沙发抢了 :evil:
    我的@是写入数据库的
    首页你啥时候也加了悬浮显示咯?文章标题那里
    收着 有空在琢磨琢磨 那个微博同步的 我这边不支持定时文章,目前还木有检测出是哪里的问题(懒,没仔细检查)

    1. MOD回复

      @World:
      同写数据库。
      文章标题的tip一直都有啊。
      我是最近忙

    2. @kn007: 好辛苦 忙中注意身体吧 :lol:

    3. MOD回复

      @World: 嗯,谢谢

  3. 不折腾,纯支持

    1. MOD回复

      @从良未遂: 谢谢。早上好

    2. @kn007: 你是一直守在这的啊 :o

    3. MOD回复

      @从良未遂: 准备上班去了

  4. LV3回复

    还是hover再触发ajax比较好,就100个@要get100次么。。完全不知道体验好在哪。

    浪费性能还是用静态页面吧。 表情 短代码 哪个不是正则表达式,你输出文章的时候都要autop。。

    1. LV5回复

      @大发: 昨晚试了一下,刷新一下 firebug 看到好多好多请求。。。

    2. MOD回复

      @老杨: :o 说明很多评论不存在? :o 想这篇文章就多了2个请求。。(正文一个、评论一个)

    3. LV5回复

      @kn007: 可能我没改对吧,不折腾了。

    4. MOD回复

      @大发: 我文章写了好吧。你还拿来说事,本来就是实现着玩的,放hover又不麻烦,改改就好了,我又不是保姆。
      下个月这个功能就不要了。没什么用

    5. @kn007: 确实没啥用 拖进程 :arrow:

    6. MOD回复

      @World: 过完这个月就丢掉这个功能,感觉没什么用

    7. LV3回复

      @kn007: 擦,你看好我是写啥。。。你自己写的。。改进地方也有,就是鼠标悬停再ajax请求,这样可以节省请求。不过目前这样,体验比较好。,我就问下你体验哪里好。。。

    8. MOD回复

      @大发: 不用hover后请求等待,有时懒得等待,别认为每个人都跟你一样在国内,无所谓这些

    9. MOD回复

      @大发:
      我之所以这样分享代码,文章也说,就是每个人拿过去直接就可以用了基本上。比较大部分代码都是判断如果存在就显示。
      这个代码直接获取后放末尾,通用强,至于想进阶的就自己改改就好了,放在hover下就行了,IF已经有了,去掉开头each就行了。

  5. 回复

    效果咋样啊,有图片最好了、、

  6. LV1回复

    服务器玩家可以折腾一下,主机玩家还是算了吧

    1. MOD回复

      @锋子: 也都还好吧。。

  7. 这个看着好复杂咯,不懂咯~~~

    1. MOD回复

      @夜枫: 好吧

  8. 回复

    敲了多长时间,还加上了文学创作的 啊

  9. LV1回复

    很实用的功能,棒棒的!

    1. MOD回复
  10. 你网站速度依旧很快~还是美国的主机吗

    1. MOD回复

      @所谓刚子: 是啊,美国vps

    2. @kn007: 我这里访问他的很慢 :???:

    3. MOD回复

      @World: 你是说访问我么?

    4. MOD回复

      @World: 深圳电信,没道理啊,东莞教育网走的就是深圳电信,都是秒开的

    5. @kn007: 不是,是访问刚子的 影响速度的因素很多了 可能那个时候我这边整个局域网网速不高

    6. MOD回复

      @World: 哦哦,貌似是未优化的机机

    7. @kn007: 夜猫子 :evil:

    8. MOD回复

      @World: 嘿嘿,搞了点东西

;-):|:x:twisted::smile::shock::sad::roll::razz::oops::o:mrgreen::lol::idea::grin::evil::cry::cool::arrow::???::?::!: