首页 > 代码库 > js操作Cookie,实现历史浏览记录

js操作Cookie,实现历史浏览记录

/** * history_teacher.jsp中的js,最近浏览名师 * @version: 1.0 * @author: mingming */$(function(){	getHistory();});var historyCount=4; //保存历史记录个数/** * 增加浏览历史记录 * @param id 编号 * @param name 姓名 * @param photo 照片 * @param grade 年级 * @param subject 科目 * @return */function setHistory(id,name,photo,grade,subject){	stringCookie=getCookie(‘history‘);    var stringHistory=""!=stringCookie?stringCookie:"{history:[]}";    var json=new JSONHistory(stringHistory);  //转成json    var list = json[‘history‘];  //获得json    for (var i = 0; i < list.length; i++) {    	try {    		if(list[i].id == id){        		list.splice(i,1); //删除重复数据,开始位置,删除个数        		i=i-1; //下标归位        	}		} catch (e) {			break;		}	}        if(list.length>=historyCount){    	//删除最开始的多余记录    	var count = list.length - historyCount + 1; //需要删除的个数    	list.splice(0,count); //开始位置,删除个数    }        var e="{id:‘"+id+"‘,name:‘"+name+"‘,photo:‘"+photo+"‘,grade:‘"+grade+"‘,subject:‘"+subject+"‘}";    json[‘history‘].push(e);//添加一个新的记录    setCookie(‘history‘,json.toString(),365); //365天}/** * 获得浏览历史记录 * @return */function getHistory(){	var historyJSON=getCookie(‘history‘);	if(historyJSON==""){	}else{		var data = http://www.mamicode.com/eval("("+historyJSON+")");		var history = data[‘history‘]; //历史记录		var length = history.length;		if(length > historyCount){			length = historyCount;		}		//从最后一个浏览记录开始获取		var historyHtml="";		for ( var i = length-1; i >= 0; i--) {			historyHtml+=			‘<dd>‘+	          ‘<ul>‘+	            ‘<li class="recimg"><a href="http://www.mamicode.com/‘+PATH+"/teacher/teacherinfo?teacherVO.teacherId="+history[i].id+‘"><img src="http://www.mamicode.com/‘+PATH +"/"+ history[i].photo +‘"  /></a></li>‘+	            ‘<li class="recinfo">‘+	              ‘<p><a href="http://www.mamicode.com/‘+PATH+"/teacher/teacherinfo?teacherVO.teacherId="+history[i].id+‘">‘+history[i].name+‘</a></p>‘+	              ‘<p class="grayp">科目:‘+history[i].subject+‘</p>‘+	              ‘<p class="grayp">年级:‘+history[i].grade+‘</p>‘+	            ‘</li>‘+	          ‘</ul>‘+	        ‘</dd>‘;		}				if(historyHtml!=""){			$("#historyTeacher").html(‘<h2>最近浏览名师</h2><dl>‘+historyHtml+‘</dl>‘);		}	}}/** * 添加cookie * @param cookName cookie名称 * @param cookName cookie值 * @param expiredays 时长 */function setCookie(cookName,cookValue,expiredays){    var exdate=new Date();    exdate.setDate(exdate.getDate()+expiredays*24*3600*1000);    var cookieVal=cookName+ "=" +escape(cookValue)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString())+";path=/";    document.cookie=cookieVal;}/** * 获取cookie * @param cookName cookie名称 * @return */function getCookie(cookName){    if(document.cookie.length>0){    	var c_start = document.cookie.indexOf(cookName + "=");    	if(c_start!=-1){ //存在    		c_start = c_start + cookName.length + 1; //"history="后的开始位置    		var c_end=document.cookie.indexOf(";",c_start); //找到JSESSIONID在的位置    		if (c_end==-1){ //JSESSIONID不存在    			c_end=document.cookie.length;    		}    		return unescape(document.cookie.substring(c_start,c_end));        }     }    return "";}/** * JSON */var JSONHistory = function(sJSON){	this.objType = (typeof sJSON);	if(this.objType==‘string‘ && ‘‘==sJSON){	      sJSON = ‘{history:[]}‘ ;	}    this.self = [];    (function(s,o){    	for(var i in o){    		o.hasOwnProperty(i)&&(s[i]=o[i],s.self[i]=o[i])    		};})(this,(this.objType==‘string‘)?eval(‘0,‘+sJSON):sJSON);};JSONHistory.prototype = {    toString:function(){        return this.getString();    },    valueOf:function(){        return this.getString();    },    getString:function(){        var sA = [];        (function(o){            var oo = null;            sA.push(‘{‘);            for(var i in o){                if(o.hasOwnProperty(i) && i!=‘prototype‘){                    oo = o[i];                    if(oo instanceof Array){                        sA.push(i+‘:[‘);                        for(var b in oo){                            if(oo.hasOwnProperty(b) && b!=‘prototype‘){                                sA.push(oo[b]+‘,‘);                                if(typeof oo[b]==‘object‘) arguments.callee(oo[b]);                            }                        }                        sA.push(‘],‘);                        continue;                    }else{                        sA.push(i+‘:\‘‘+oo+‘\‘,‘);                    }                    if(typeof oo==‘object‘) arguments.callee(oo);                }            }            sA.push(‘},‘);        })(this.self);        return sA.slice(0).join(‘‘).replace(/\[object object\],/ig,‘‘).replace(/,\}/g,‘}‘).replace(/,\]/g,‘]‘).slice(0,-1);    },    push:function(sName,sValue){        this.self[sName] = sValue;        this[sName] = sValue;    }};

中间对于把历史记录转换为json格式有更简便的方法。这个是个单独案例。

页面引入js,增加浏览历史记录调用

setHistory(id,name,photo,grade,subject)

cookie参数设置:

path:

  是相对于应用服务器存放应用的文件夹的根目录而言的(比如tomcat下面的webapp),因此cookie.setPath("/");之后,可以在webapp文件夹下的所有应用共享cookie

  测试结果:不设置,则当前目录下所有页面可以访问,设置”/“后,所有页面都可以访问

domain: 

  在www.baidu.com中设置的cookie,但需要在zhidao.baidu.com下获取,这样就需要Cookie的setDomain()方法了。  cookie.setPath("/");  cookie.setDomain("baidu.com");//只给出域名的相同部分

cookie参数设置参考文档:

setPath和setCookie具体用法