首页 > php框架 > ThinkPHP > 正文

tp5实现收藏功能并且可切换颜色的方法

藏色散人
发布: 2020-04-28 13:59:55
转载
2806 人浏览过

tp5实现收藏功能并且可切换颜色的方法

html页面中,引用了bootstrap 的图标

                            {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 id="collection" class="icon-heart cs"></i><br />
                            </div>
                            {else/}
                            <div >
                                <i id="collection" class="icon-heart"></i><br />
                            </div>
                            {/if}
登录后复制

css 样式

<style>
.like{ font-size:66px;  color:#ccc; cursor:pointer;}
.cs{color:#FF0000;}
</style>
登录后复制

js 中

 $("#collection").click(function(){
$.ajax({
    type:&#39;POST&#39;,
    url:"home_collection.html",
    data:{
        "art_id": {$data[&#39;id&#39;]},        // 传过去文章表的id
    },
    dataType:"json",
    success:function(data){    
        var res = JSON.parse(data);     // json 字符串转化为对象
        if (res.code == &#39;3&#39;)            // 收藏成功,变成红色
        {    
            $(&#39;#collection&#39;).toggleClass(&#39;cs&#39;);         
            // document.getElementById(&#39;collection&#39;).style.background="#FF0000";  // 另一种样式,这是把整个背景都变红了 
            console.log(res.code);
        }
        if (res.code == &#39;4&#39;)           // 取消收藏
        {
            $(&#39;#collection&#39;).toggleClass(&#39;cs&#39;); 
            console.log(res.code);         
        }
    },
    error:function(data){
        console.log(data);
        console.log(data.code);
        alert(222);
    } 
});          
});
登录后复制

控制器中

// 当图标变颜色的时候,点击是取消收藏,当图片没颜色的时候点击是收藏
// 查询数据库是否存在,如果不存在则加入,存在则删除,前台也变样式
public function collection()
{
$data = $_POST;
$uname1 = session::get(&#39;USER_INFO&#39;);
$uid = $uname1[&#39;uid&#39;];
// 应该查询当前用户对应的art_id 存不存在在 收藏表 中
$result = DB::name(&#39;collection&#39;)->where(&#39;art_id&#39;,$data[&#39;art_id&#39;])->select();
if($result)
{
$aa = DB::name(&#39;collection&#39;)->where(&#39;art_id&#39;,$data[&#39;art_id&#39;])->delete();
$returnData = [&#39;code&#39;=>4, &#39;info&#39;=>&#39;取消收藏&#39;];
}else{
$bb[&#39;art_id&#39;] = $data[&#39;art_id&#39;]; // 对应文章表的id
$bb[&#39;uid&#39;] = $uid ;
$bb = DB::name(&#39;collection&#39;)->insert($bb);
$returnData = [&#39;code&#39;=>3, &#39;info&#39;=>&#39;收藏成功&#39;];
}
// header(&#39;Content-Type:application/json; charset=utf-8&#39;); 
$data3 = json_encode($returnData,JSON_UNESCAPED_UNICODE);    //这样也正确
return $data3;
// return json_encode($returnData);// 这样返回格式正确
}
登录后复制

推荐教程:《TP5

以上是tp5实现收藏功能并且可切换颜色的方法的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
tp5
来源:csdn.net
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!