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 = 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="‘+PATH+"/teacher/teacherinfo?teacherVO.teacherId="+history[i].id+‘"><img src="‘+PATH + "/"+ history[i].photo +‘"  /></a></li>‘+
	            ‘<li class="recinfo">‘+
	              ‘<p><a href="‘+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具体用法

js操作Cookie，实现历史浏览记录,布布扣,bubuko.com