单击来顶一下文字链接就会在当前总顶数量上+1，并弹出提示信息为谢谢您的支持的对话框，如果用户再单击（顶一下）就会提示您已提交过的信息，因为帝国cms的顶一下功能做了限制，同一个IP地址只能对同一篇文章顶一次。由于使用弹出对话框的方式对于用户体验来说效果一般般，所以我就改成了以下这种方式展示
修改步骤一：首先我们将帝国cms建站程序默认的顶一下HTML代码修改为以下代码所示。
修改步骤二：在相关内容模板页或JS文件中加入以下javascript代码（注意：因为此javascript代码功能基于jQuery的强大方法，所以在此JS代码之前必须载入jQuery库文件）。
修改步骤一：首先我们将帝国cms建站程序默认的顶一下HTML代码修改为以下代码所示。
<!--帝国cms建站程序默认的顶一下HTML代码块-->
<table border="0" align="center" cellpadding="0" cellspacing="0" class="digg">
<tr>
<td class="diggnum" id="diggnum"><strong><script type="text/javascript" src="[!--news.url--]e/public/ViewClick/?classid=[!--classid--]&id=[!--id--]&down=5"></script></strong></td>
</tr>
<tr>
<td class="diggit"><a href="JavaScript:makeRequest('[!--news.url--]e/public/digg/?classid=[!--classid--]&id=[!--id--]&dotop=1&doajax=1&ajaxarea=diggnum','EchoReturnedText','GET','');">来顶一下</a></td>
</tr>
</table>
<!--将以上的代码替换成以下代码-->
<span class="dianzan" id="dianzan"><a class="icon-thumbs-up-2" href="#"><em>[!--diggtop--]</em>人赞过</a></span>
|
修改步骤二：在相关内容模板页或JS文件中加入以下javascript代码（注意：因为此javascript代码功能基于jQuery的强大方法，所以在此JS代码之前必须载入jQuery库文件）。
<script type="text/javascript">
$(".dianzan").click(function(){
event.preventDefault();
$.ajax({
type:"GET",
url:"[!--news.url--]e/public/digg/",
data:{"classid":[!--classid--],"id":[!--id--],"dotop":1,"doajax":1,"ajaxarea":"diggnum"},
dataType:"text",
success:function(data){
var reinfo = data.split("|");
if (reinfo.length != 1) {
if (reinfo[0] != "") {
$(".dianzan em").html(reinfo[0]);
}
if (reinfo[2] != "") {
var left = parseInt($(".dianzan").offset().left)+20, top = parseInt($(".dianzan").offset().top);
$(".zan").remove();
if (reinfo[2] == "谢谢您的支持") {
$(".dianzan").append('<div class="zan">+1 谢谢您的支持</div>');
}else{
$(".dianzan").append('<div class="zan">已赞</div>');
}
$(".zan").css({"position":"absolute","z-index":"1","left":left+"px","top":top+"px","color":"inherit"}).animate({top:top-30},"slow",function(){$(this).fadeIn("fast").remove();});
}
}else{}
}
});
});
</script>
|
转载请注明：帝国CMS» 帝国cms 来顶一下(点赞功能)优化提高用户体验
标签：
