帝国CMS列表内AJAX无刷新点赞代码
时间:2024年04月10日
/来源:网络
/编辑:佚名
实现列表内AJAX无刷新点赞,直接上代码,注意需要jquery.min.js支持!
列表模板里写:
<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('<div class="zan">+1 谢谢您的支持</div>');
//$("body").append('<div class="zan">+1 谢谢您的支持</div>');
}else{
mythis.append('<div class="zan">已赞</div>');
//$("body").append('<div class="zan">已赞</div>');
}
//"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","width":"120px","height":"60px","background":"#fff","border-radius":"6px"}).animate({top:-top-30},"slow",function(){$(this).fadeIn("fast").remove();});
}
}else{}
}
});
});
</script>
列表内容模板需要点赞的地方写:
<a href="[!--titleurl--]" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="icon-thumbs-up" data-classid="[!--classid--]" data-id="[!--id--]"><span class="font"><i class="fa fa-heart-o"></i><em>[!--diggtop--]</em>个赞</span></a>
效果如下图:
列表模板里写:
<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('<div class="zan">+1 谢谢您的支持</div>');
//$("body").append('<div class="zan">+1 谢谢您的支持</div>');
}else{
mythis.append('<div class="zan">已赞</div>');
//$("body").append('<div class="zan">已赞</div>');
}
//"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","width":"120px","height":"60px","background":"#fff","border-radius":"6px"}).animate({top:-top-30},"slow",function(){$(this).fadeIn("fast").remove();});
}
}else{}
}
});
});
</script>
列表内容模板需要点赞的地方写:
<a href="[!--titleurl--]" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="icon-thumbs-up" data-classid="[!--classid--]" data-id="[!--id--]"><span class="font"><i class="fa fa-heart-o"></i><em>[!--diggtop--]</em>个赞</span></a>
效果如下图:
新闻资讯 更多
- 【帝国cms教程】帝国CMS列表内AJAX无刷新点赞代码04-10
- 【帝国cms教程】帝国cms如何批量替换图片以及字段值04-10
- 【帝国cms教程】帝国cms利用bqno输出不同的样式,第一条输出不同样式bqno=1输出box_current04-10
- 【帝国cms教程】帝国cms自定义专题列表模板list.var中获取对应专题下的信息、信息数量及信息所属栏目名称04-10
- 【帝国cms教程】帝国cms专题内容列表模板list.var中显示bqno不同的样式04-10
- 【帝国cms教程】帝国CMS自动刷新首页自定义列表的方法04-10
- 【帝国cms教程】帝国cms截取当前文章标题匹配相关链接04-10
- 【帝国cms教程】帝国cms标题、内容、关键词批量替换sql语句04-04
热门文章
- 178Moban源码谈谈免费源码与收费源码的区别
- 2帝国CMS忘记后台登陆用户名、密码、认证码的解决方法
- 3帝国CMS(EmpireCMS) v7.5后台任意代码执行漏洞及具体修复方法
- 4帝国CMS和WordPress 哪个好?哪个适合建站?
- 5如何解决Discuz的密码错误次数过多请15分钟后登陆的问题
- 6帝国cms灵动标签取得内容和栏目链接地址
- 7emlog pro 注册码“开心”教程(如果有一天,emlog官方版 或者 emlog免费版 跑路了,那用户怎么办?)
- 8帝国cms后台登录出现”您还未登录”怎么解决?
- 9织梦CMS在nginx下设置伪静态方法(附nginx伪静态规则)
- 10帝国cms7.5忘记登录密码 和忘记登录认证码以及多次登录 失败被锁定解决办法