最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

帝国cms首页列表页怎么添加点赞功能

来源:动视网 责编:小采 时间:2020-11-27 20:08:15
文档

帝国cms首页列表页怎么添加点赞功能

帝国cms首页列表页怎么添加点赞功能:这次给大家带来的是在帝国cms首页列表页怎么添加点赞功能,帝国CMS模版是很好用的,如果想在模版的基础上添加一些自己需要的功能需要怎么实现呢?这篇文章就给大家好好分析一下。查看帝国cms建站程序新闻系统的内容页模版代码,找到顶一下的HTML代码块,如下
推荐度:
导读帝国cms首页列表页怎么添加点赞功能:这次给大家带来的是在帝国cms首页列表页怎么添加点赞功能,帝国CMS模版是很好用的,如果想在模版的基础上添加一些自己需要的功能需要怎么实现呢?这篇文章就给大家好好分析一下。查看帝国cms建站程序新闻系统的内容页模版代码,找到顶一下的HTML代码块,如下


这次给大家带来的是在帝国cms首页列表页怎么添加点赞功能,帝国CMS模版是很好用的,如果想在模版的基础上添加一些自己需要的功能需要怎么实现呢?这篇文章就给大家好好分析一下。

查看帝国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','');" rel="external nofollow" >来顶一下</a></td> 
</tr> 
</table>

由以上代码可知,当前的总顶数是通过动态脚本载入的方式实时输出,而a标签上的makeRequest()函数就是用来实现顶一下功能的方法。makeRequest()函数的第一个参数是请求地址并附带参数数据,第二个参数是成功请求后执行的回调函数名,第三个参数指定以GET方式发送请求。了解实现的原理之后就很容易在网站其他页面上实现顶一下(点赞)功能,以下给出实现方法的相关代码。

例如我们需要在产品列表模板页面上实现顶一下功能,那么首先就需要修改产品列表模板的代码,以下是我修改后的列表模板代码:

列表内容模板(list.var)

$nomar=""; 
if($no%4==0){$nomar=" class=\"nomar\"";}else{$nomar="";} 
if($r[titlepic]){$tpic=sys_ResizeImg($r[titlepic],300,300,1,"");}else{$tpic="/e/data/images/notimg.gif";} 
$listtemp='<li'.$nomar.'><p class="photo"><img src="'.$tpic.'"><a href="[!--titleurl--]" rel="external nofollow" rel="external nofollow" rel="external nofollow" ><p class="txt"><h3>查看<br>详情</h3></p></a></p> 
<b><a href="[!--titleurl--]" rel="external nofollow" rel="external nofollow" rel="external nofollow" >[!--title--]([!--model--])</a></b> 
<a href="[!--titleurl--]" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="icon-thumbs-up" data-classid="[!--classid--]" data-id="[!--id--]"><em>[!--diggtop--]</em>人赞过</a></li>'; 
最后在底部模板里或JS文件中加入以下js代码,大功告成
[html] view plain copy print?
<script type="text/javascript"> 
$(".icon-thumbs-up").click(function(event){ 
 event.preventDefault(); 
 var mythis = $(this); 
 var classid = mythis.data("classid"); 
 var id = mythis.data("id"); 
 $.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] != "") { 
 mythis.find("em").html(reinfo[0]); 
 } 
 if (reinfo[2] != "") { 
 //var left = parseInt(mythis.offset().left)+20, top = parseInt(mythis.offset().top); 
 var left = 20, top = mythis.find("em").get(0).offsetHeight; 
 $(".zan").remove(); 
 if (reinfo[2] == "谢谢您的支持") { 
 mythis.append('<p class="zan">+1 谢谢您的支持</p>'); 
 //$("body").append('<p class="zan">+1 谢谢您的支持</p>'); 
 }else{ 
 mythis.append('<p class="zan">已赞</p>'); 
 //$("body").append('<p class="zan">已赞</p>'); 
 } 
 //"text-shadow":"0 1px 0 rgba(0,0,0,0.5)","font-family":"simsun" 
 $(".zan").css({"position":"absolute","z-index":"10","left":left+"px","top":-top+"px","color":"inherit"}).animate({top:-top-30},"slow",function(){$(this).fadeIn("fast").remove();}); 
 } 
 }else{} 
 } 
 }); 
}); 
</script>

相信看了以上介绍你已经掌握了方法,更多精彩请关注Gxl网其它相关文章!

相关阅读:

如何用vue实现登录验证

js实现仿window系统日历效果

JS怎样可以做到点击跳转到登陆的个人邮箱

文档

帝国cms首页列表页怎么添加点赞功能

帝国cms首页列表页怎么添加点赞功能:这次给大家带来的是在帝国cms首页列表页怎么添加点赞功能,帝国CMS模版是很好用的,如果想在模版的基础上添加一些自己需要的功能需要怎么实现呢?这篇文章就给大家好好分析一下。查看帝国cms建站程序新闻系统的内容页模版代码,找到顶一下的HTML代码块,如下
推荐度:
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top