zoukankan      html  css  js  c++  java
  • 添加收藏

    接口包含:添加收藏,删除收藏,检测收藏

    前台传值:id与收藏页来源类型 

    获取网页数据ID值方法2种:

    1:后台传值放隐藏域中

    2:用JS方法取网址ID

        function getUrlParam(){
            return location.href.match(/([^?=&]+)(=([^&]*))/g).reduce((a, v) => ((a[v.slice(0, v.indexOf('='))] = v.slice(v.indexOf('=') + 1)), a), {});
        }

    调用:

    id=getUrlParam().school_id;

    实现收藏代码:

    //收藏
        var delete_id , type = $('#collectionType').val(), id=$('#newsId').val();
        //这里的两个函数分别代码fn1,fn2
        check_collection( function(){
            $('.collection').addClass('active');
            console.log(1)
        } , function(){
            $('.collection').removeClass('active');
            console.log(2)
        } );
    
        //检查是否收藏
        function check_collection( fn1 , fn2){
            $.post(com.url.check_is_collection , {
                collection_type:type,
                collection_id:id
            } , function(res){
                if(res.result == 'succ'){
                    delete_id = res.data.id;
                    fn1();//调到接口说明收藏初始时加active上方的check_collection函数,否则不加
                }else {
                    fn2();
                }
            })
        }
    
        //添加收藏   ,  删除收藏
        function collection(url  , newsId , fn){
            $.post(url , {
                collection_type:type,
                collection_id:newsId
            } , function(res){
                if(res.result == 'succ'){
                    fn()
                console.log(fn);//执行下方添加或取消收藏函数
                }else {
                    com.prompt(res.message);
                }
            })
        }
    
        $('.collection').click(function(){
            var _this = $(this);
            var source = com.get_source();
            if((window.location.href).indexOf('passport') < 0){
                //未登录
                if(is_login <= 0 && !$('#login_ifr').attr('src')){
                    var ifHtml = '<iframe id="login_ifr" style="display:block;" class="login_ifr none" src="'+passportHost + '/xuemaotouch/login/login_layer.php?back_url='+location.href+'&source='+source+'&source_platform='+source_platform+'"></iframe>';
                    $('body').append(ifHtml);
                    $("body").css("overflow","hidden");
                    return false;
                }
    
                if($('#login_ifr').attr('src')){
                    $('#login_ifr').show();
                    $("body").css("overflow","hidden");
                    return false;
                }
    
                //增加自定义属性,给数埋点用
                if(_this.hasClass('active')){
                    _this.attr('status' , 'cancel');
                }else {
                    _this.attr('status' , 'add');
                }
    
                clearTimeout(timer);
                timer =  setTimeout(function(){
                    check_collection(function(){
                        collection(com.url.delete_collection , delete_id , function(){
                            $('.collection').removeClass('active');
                            com.prompt('取消成功');
                        });
    
                    },function(){
                        collection(com.url.add_collection , id , function(){
                            $('.collection').addClass('active');
                            com.prompt('收藏成功');
                        });
    
                    }  );
                } , 1000)
    
            }
        });
  • 相关阅读:
    Django Rest framework基础使用之Request/Response
    Django Rest framework基础使用之 serializer
    python基础(一)
    python实现本地图片上传到服务区
    开发中遇到的问题记录
    九、xadmin菜单分组管理
    leetcode-7-整数翻转
    leetcode-6-Z 字形变换
    leetcode-5-最长回文子串
    leetcode-3-无重复字符的最长子串
  • 原文地址:https://www.cnblogs.com/liubingyjui/p/10302466.html
Copyright © 2011-2022 走看看