????????????????????????????{if?condition="$color?==?5"} ????????????????????????????<div> ????????????????????????????????<!-- <i id="collection" class="icon-heart cs"></i><br /> --> ????????????????????????????????<!-- <i id="collection" class="icon-heart" class2="cs"></i><br /> --> ????????????????????????????????<i></i><br> ????????????????????????????</div> ????????????????????????????{else/} ????????????????????????????<div> ????????????????????????????????<i></i><br> ????????????????????????????</div> ????????????????????????????{/if}
css 樣式
<style> .like{ font-size:66px; color:#ccc; cursor:pointer;} .cs{color:#FF0000;} </style>
JS 中
?$("#collection").click(function(){ $.ajax({ ????type:'POST', ????url:"home_collection.html", ????data:{ ????????"art_id":?{$data['id']},????????//?傳過去文章表的id ????}, ????dataType:"json", ????success:function(data){???? ????????var?res?=?JSON.parse(data);?????//?json?字符串轉化為對象 ????????if?(res.code?==?'3')????????????//?收藏成功,變成紅色 ????????{???? ????????????$('#collection').toggleClass('cs');????????? ????????????//?document.getElementById('collection').style.background="#FF0000";??//?另一種樣式,這是把整個背景都變紅了? ????????????console.log(res.code); ????????} ????????if?(res.code?==?'4')???????????//?取消收藏 ????????{ ????????????$('#collection').toggleClass('cs');? ????????????console.log(res.code);????????? ????????} ????}, ????error:function(data){ ????????console.log(data); ????????console.log(data.code); ????????alert(222); ????}? });?????????? });
控制器中
//?當圖標變顏色的時候,點擊是取消收藏,當圖片沒顏色的時候點擊是收藏 //?查詢數據庫是否存在,如果不存在則加入,存在則刪除,前臺也變樣式 public?function?collection() { $data?=?$_POST; $uname1?=?session::get('USER_INFO'); $uid?=?$uname1['uid']; //?應該查詢當前用戶對應的art_id?存不存在在?收藏表?中 $result?=?DB::name('collection')->where('art_id',$data['art_id'])->select(); if($result) { $aa?=?DB::name('collection')->where('art_id',$data['art_id'])->delete(); $returnData?=?['code'=>4,?'info'=>'取消收藏']; }else{ $bb['art_id']?=?$data['art_id'];?//?對應文章表的id $bb['uid']?=?$uid?; $bb?=?DB::name('collection')->insert($bb); $returnData?=?['code'=>3,?'info'=>'收藏成功']; } //?header('Content-Type:application/json;?charset=utf-8');? $data3?=?json_encode($returnData,JSON_UNESCAPED_UNICODE);????//這樣也正確 return?$data3; //?return?json_encode($returnData);//?這樣返回格式正確 }
推薦教程:《TP5》
? 版權聲明
文章版權歸作者所有,未經允許請勿轉載。
THE END