点赞、踩及收藏功能

		/*点赞点踩收藏*/
		.link_reward .link_box {
		    float: left;
		    margin-right: 20px;
		}	
		.link_reward .link_box a {
		    display: inline-block;
		}	
		.zan_statue{background:url(dianzan_huise.png) no-repeat left;background-position-y: 10px;background-size: 26%;}
		.yizan_curs i {background: url(dianzan_hongse.png) no-repeat;background-size: contain;}		
		.link_box_support .yizan_curs span, .link_box_support .yizan_curs em {color: #f04748;}		
		.oppse_icon1{
			background: url(cai_huise.png) no-repeat;
	        background-size: contain;			
		}
		.oppse_icon{
			background: url(cai_hongse.png) no-repeat;
	        background-size: contain;
		}	
		.manage_sc{
		    background: url(shoucang_huise.png) no-repeat;
		        background-size: contain;
		}
		.manage_qxsc{
		    background: url(shoucang_hongsese.png) no-repeat;
		        background-size: contain;
		}	
<div class="link_reward clearfix">
      <div class="link_box link_box_support"><a href="javascript:pub_support(252898);" class="clearfix zan_statue"><i></i><span style="margin-right:5px;">&nbsp;赞</span><span>(<em class="sup_number">27</em>)</span></a></div>
      <div class="link_box link_box_oppose"><li class="tools_oppose"><a href="javascript:;" class="manage_oppose" id="expressoppose_252898"><i class="oppse_icon"></i><span id="e_support_252898" style="color: rgb(240, 71, 72);">踩3</span></a></li></div>
      <div class="link_box link_box_collent"><li class="manage_list" id="adminiexp_252898"><a href="javascript:void(0);" class="admini_collect" data-okind="express" data-oid="252898" data-act=""><i class="manage_sc"></i><span>收藏</span></a></li></div>
</div>

 

		//点踩
		$('.manage_oppose').on('click',function(e){
			var _id = $(this).attr('id').split('_');
			if($('.link_box_support a').hasClass('yizan_curs')){
				pl_pop('已赞过了!');
				return;
			}else{
				$('.link_reward .tools_oppose i').removeClass('oppse_icon1');
				$('.link_reward .tools_oppose i').addClass('oppse_icon');
				$('#e_support_'+_id[1]).css('color','#f04748');
//				$('#e_support_'+_id[1]).html('踩'+parseInt(cont.oppose_num)+1);
				$('#e_support_'+_id[1]).html('踩'+(parseInt(cont.oppose_num)+1));
		        $.post(
		            "xxxxxxxxxxxxxxxxxxxx",
		            {kind:'express', id:_id, type:"oppose"},
		            function(data){
		            	localStorage.setItem("oppose_status_express_"+_id,"yes");
		            }
		        );
			}
		});
    //点赞
    function pub_support(_id){
        if($('.link_box_oppose i').hasClass('oppse_icon')){
			pl_pop('已踩过了!');
			return;        	
        }else{
	        if(storage.getItem("praised_status_live_msg_"+_id)=="yes"){
	            return;
	        }
	        if (support_list.indexOf(_id) >= 0){
	            return;
	        }
	        support_list.push(_id);
	    	var support_num = parseInt(jQuery(".sup_number").html());
	        jQuery(".sup_number").html(support_num+1);
	        jQuery(".sup_number").parents('a').addClass("yizan_curs");
	        jQuery(".sup_number").parents('a').removeClass("zan_statue");
	        jQuery.post(
	            "xxxxxxxxxxxxxxxxxxxxxxxxx",
	            {kind:"express", id:_id, type:"support"},
	            function(data){
	                localStorage.setItem("praised_status_live_msg_"+_id,"yes");
	            }
	        ); 
        }
    }
       	//收藏
       	$('.manage_list').on('click',function(e){
       		var _id = $(this).attr('id').split('_');
       		if($('.admini_collect span').html()=='收藏'){
       			$('.mp_det_inner').html('收藏成功!')
     			$('.managePopdet').show().delay (500).fadeOut();
       			$('.admini_collect span').html('已收藏');
       			$('.link_reward .manage_list i').removeClass('manage_sc');
       			$('.link_reward .manage_list i').addClass('manage_qxsc');       			
       		}else{
//     			$('.mp_det_inner').html('您已取消收藏!')
//   			$('.managePopdet').show().delay (3000).fadeOut();
				$('.managePopup').show();
				$('.mP_psg').hide();
				$('.manageBg').show();
				$('.mP_confirm').on('click',function(){
	       			$('.admini_collect span').html('收藏');
	       			$('.managePopup').hide();
					$('.manageBg').hide();
	       			$('.link_reward .manage_list i').removeClass('manage_qxsc');
	       			$('.link_reward .manage_list i').addClass('manage_sc');	
				})
       			
       		}
	        $.post(
	            "xxxxxxxxxxxxxxxxxxxxxxx",
	            {kind:'express',md:_Libs.md, o_id:_id},
	            function(data){
	            	localStorage.setItem("oppose_status_express_"+_id,"yes");
	            }
	        );       		
       	});

 

  • 3
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
2021已然来临,在此之际debug抽空撸了一套 类似“QQ空间”、“新浪微博”、“微信朋友圈”PC版的互联网社交软件系统,并将其录制成了视频,特此分享给诸位进行学习,以掌握、巩固更多的技术栈和项目、产品开发经验! 言归正常,下面以问答的方式重点介绍下本门课程/系统的相关内容!  (1)问题一:这是一门什么样的课程? 本门课程是一门项目实战课程,基于Spring Boot2.X开发的一款类似“新浪微博”、“QQ空间”、“微信朋友圈”PC版的互联网社交软件,包含完整的门户网前端 以及 后台系统管理端,可以说是一套相当完整的系统!,大纲图如下所示:  而整个系统的系统架构设计如下图所示(注意:该图表示的是整个系统架构将经历N个阶段的演进,目前初定是4个阶段的演进,分别是架构1.0、2.0、3.0、4.0 !)   (2)问题二:可以学到哪些技术? 本课程对应着系统架构1.0,即第一阶段,主要的目标在于实现一个完整的系统,可以学到的技术还是比较多的:Spring Boot2.X、Java基础、Java8、JUC、NIO、微服务、分布式、系统架构设计、SpringMVC、MySQL、Lucene、多线程、并发编程、Bootstrap、HTML5、CSS3、JQuery、AdminLTE、VUE、LayUI相关组件等等 从架构2.0,即第二阶段的内容(对应第2门课程)开始将慢慢融入更多地技术栈,用以解决更多的业务、性能和服务拆分等问题!本门课程是后续其他阶段对应的课程的奠基,因此如果想要学习后续架构2.0、3.0、4.0的演进,则必须得先学习本门课程!   (3)问题三:系统运行起来有效果图看吗?   (4)问题四:学习本课程之前有什么要求? 要求的话,主要有两点,一是要有一定的Spring Boot、MySQL 以及 Web开发基础;二是最好学过Debug录制的 “企业权限管理平台(Spring Boot2.X+Shiro+Vue)”项目实战课程,因为本门课程“仿微博系统全程实战”的后台管理正是基于 “企业权限管理平台”项目二次开发的,因此建议最好先撸了那个课程再来学习本门课程! 友情提示:“企业权限管理平台(Spring Boot2.X+Shiro+Vue)”项目实战课程的购买学习地址:https://edu.csdn.net/course/detail/25646  (TIP:可以考虑购买组合套餐课程哦,更加实惠!!!)  岁末将至,人心浮躁 当此之际,应当沉下心,摒弃浮躁 要相信技术是第一生产力 相信技术改变生活、技术成就梦想! 特别是那些即将在过完年准备跳槽面试的小伙伴,本系统将可以为你增添几分亮点!!!  寄语:购买本课程的小伙伴将可获得本课程完整的视频教程、系统源代码数据库、课件PPT以及其他相关的工具跟资料,还可以进专属技术交流群交流技术!!!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值