前段时间看到别人的博客有评论者等级的机制于是自己也就想弄一个。在网上查了许多资料后自己也写了一个评论等级功能。

因为没有用户注册机制,所以我们就只能依据评论者留下的邮箱来判断这名用户在网站评论过多少次。


下面是代码部分:

PHP

推荐写在emlog模版文件的module.php下面

<?php
//comment:输出等级
function echo_levels($comment_author_email){
  if($comment_author_email == '""'){
	echo 'null';
  }else{
	  $DB = MySql::getInstance();
	  $sql = "SELECT cid as author_count FROM 评论数据的表单 WHERE mail = ".$comment_author_email."and hide ='n'";
	  $res = $DB->query($sql);
	  $author_count = mysql_num_rows($res);
	  if($author_count>9999){
		  $author_count = 9999;
	  }
	  echo $author_count;
  }
}
?>


注意下 【$sql = "SELECT cid as author_count FROM 评论数据的表单 WHERE mail = ".$comment_author_email."and hide ='n'";】

其中【评论数据的表单】换成自己的,一般来说是emlog_comment


然后使用下面的代码来导出这个用户发过多少次评论。

<?php $mail_str="\"".strip_tags($comment['mail'])."\"";echo_levels($mail_str); ?>

我这里是定义了input的值然后用js去循环出等级。


JSON

这里来定义发多少次评论所对应的等级。

下面是我写的等级表。

{
	"lv_exp": [{
			"name": "Lv.萌新",
			"exp": 3,
			"color": "Magenta"
		},
		{
			"name": "Lv.初学者",
			"exp": 10,
			"color": "BlueViolet"
		},
		{
			"name": "Lv.进阶者",
			"exp": 26,
			"color": "Blue"
		},
		{
			"name": "Lv.高阶者",
			"exp": 40,
			"color": "LightSeaGreen"
		},
		{
			"name": "Lv.半大佬",
			"exp": 70,
			"color": "YellowGreen"
		},
		{
			"name": "Lv.大佬",
			"exp": 110,
			"color": "GoldenRod"
		},
		{
			"name": "Lv.顶级大佬",
			"exp": 160,
			"color": "DarkRed"
		},
		{
			"name": "Lv.世界大佬",
			"exp": 220,
			"color": "Crimson"
		},
		{
			"name": "Lv.传说",
			"exp": 380,
			"color": "Red"
		},
		{
			"name": "Lv.永恒传说",
			"exp": 9999,
			"color": "ForestGreen"
		}
	],
	"lv_null": [{
		"name": "Lv.神秘人",
		"color": "gray"
	}]
}

lv_exp是评论者有留下邮箱时的等级配置。

以如下配置为例


"name": "Lv.萌新",
"exp": 3,
"color": "Magenta"


name为等级名称。

exp如果为3则表示评论数小于等于3为萌新。

color定义了这个等级的色值。


lv_null是评论者没有留下邮箱时定义的名字和颜色。


JS

$(document).ready(function(e) {
    $.ajax({
		url:"<?php echo TEMPLATE_URL; ?>/lvList/lv.json",
		success:function(result){
        	var lvList = result.lv_exp;
			var lv_exp = $('.lv_exp');
			for(var i=0;i<lv_exp.length;i++){
				var num = lv_exp.eq(i).val();
				if(num != 'null'){
					var lvName = '';
					var lvColor='';
					var listCount = 0;
					for(var j=0;j<lvList.length;j++){
						if(parseFloat(num) <= lvList[j-listCount].exp){
							console.log(num);
							lvName = lvList[j-listCount].name;
							lvColor = lvList[j-listCount].color;
							break;
						}
					}
					$('.alv_body').eq(i).append('<div><span class="wikimoe_level_label" style="color:'+lvColor+';border-color:'+lvColor+'">'+lvName+'</span></div>');
				}else{
					var nullName = result.lv_null[0].name;
					var nullColor = result.lv_null[0].color;
					$('.alv_body').eq(i).append('<div><span class="wikimoe_level_label" style="color:'+nullColor+';border-color:'+nullColor+'">'+nullName+'</span></div>');
				}
			}
			
			$('.alv_body').fadeIn();
			
    	}
	});
});


就是循环一遍json数据然后添加到对应的元素内,这里的$('.alv_body')等元素要改成自己的元素。


CSS

/*等级*/
.alv_body{
	font-weight:bold;
	display:none;
	margin-top:5px;
	opacity: 0.6;
}
.wikimoe_level_label{
	border-style: solid;
    border-width: 1px;
    border-radius: 5px;
    padding: 0px 5px;
    display: inline-block;
	line-height: 20px;
    font-size: 12px;
}

样式其实可以无所谓,根据自己的情况进行更改。


最终效果: