最新赞助活动温馨提示:自愿赞助服务器费用,学生和没有工作的整站资源免费下载!
头像

JS+COOKIE+JSON记录用户浏览过的文章

来源:http://www.erdangjiade.com/ 沐浴春风 2015-08-20 03:08浏览(1522)

Cookie可以用来记录客户端用户ID、密码、浏览过的网页、停留的时间等信息,jQuery提供了一个cookie插件,能非常方便的读写cookie信息,若是不明白cookie.js具体用法,请查看教程" target="_blank">http://www.erdangjiade.com/js/89.html'>基于jQuery的cookie插件

0、请不要问“在不在”之类的问题,有问题直接问!1、学生或暂时没有工作的童鞋,整站资源免费下载!2、¥9.9充值终身VIP会员,加我微信,826096331 拉你进VIP群学习!3、程序员加油,技术改变世界。在线 充值

分类:其它特效 > jQuery插件 难易:中级
查看演示 下载资源 下载积分: 30 积分

引入jQuery库和cookie插件

<script src="jquery.js" type="text/javascript"></script> 
<script src="cookie.js" type="text/javascript"></script>

获取当前文章页面的文章标题和页面地址

本文以素材火精选网址作为测试地址,记录该栏目浏览过的历史。

1、获取当前文章标题和页面地址

var art_title = $(".head_inner h1").text(); //当前文章标题 var art_url = window.location.href; //当前页面地址

2、获取用户历史浏览记录,并记录长度。

var canAdd = true; //初始可以插入cookie信息  
var hisArt = $.cookie("hisArt");  
var len = 0;  
if(hisArt){  
    hisArt = eval("("+hisArt+")");  
    len = hisArt.length;  
}

3、遍历cookie,并且跟当前文章进行对比

$(hisArt).each(function(){ if(this.title == art_title){ canAdd = false; //已经存在,不能插入 return false; } });

4、写入cookie

if (canAdd == true) { 
    var json = "["
    var start = 0
    if (len > 4{ 
        start = 1
    } 
    for (var i = start; i < len; i++) { 
        json = json + "{'title': '" + hisArt[i].title + "', 'url': '" + hisArt[i].url + "'},"
    } 
    json = json + "{'title': '" + art_title + "', 'url': '" + art_url + "'}]"
 
    $.cookie("hisArt", json, { 
        expires: 36
        path: "/" 
    }); 
}

最后我们在演示页面遍历浏览历史。

$(function(){  
    var json = eval("("+$.cookie("hisArt")+")");  
    var list = "";  
    for(var i=0; i<json.length;i++){  
        list = list + "<li><a href='"+json[i].url+"' target='_blank'>"+json[i].title+"</a></li>";  
    }  
    $("#list").html(list);  
});
标签: cookie
声明:本文为原创文章,如需转载,请注明来源erdangjiade.com并保留原文链接:https://www.erdangjiade.com/js/390.html
评论0
头像

友情提示:垃圾评论一律封号 加我微信:826096331拉你进VIP群学习群

1 2