js操作クッキーでブラウズ履歴を保存します.

7086 ワード

クッキー を選択します セッション はい、
で一般的に使用される情報の格納方法です.Cookieは、クライアントが開発したブロックでユーザ情報を記憶できるところである.Sessionはサーバメモリにおいて開発されたユーザー情報を記憶するところです.
JavaScriptはクライアントで動作するスクリプトですので、Sessionを設定することは一般的にできません.cookieはクライアントで動作していますので、JSでクッキーを設定できます.ある用例フローでAページからBページにジャンプし、AページでJS用変数tempを用いてある変数の値を保存すると、BページでもJSを用いてtempの変数値を参照する必要があります.JSにおけるグローバル変数や静的変数のライフサイクルは限られています.ページのジャンプやページが閉じられているとき、これらの変数の値は再読み込みされます.つまり保存の効果がありません.この問題を解決する最善の方法は、クッキーを用いて変数の値を保存することであるが、クッキーをどのように設定して読み込むか?まず、クッキーの構造を少し理解する必要があります.簡単に言えば、クッキーはキーパッドの形で保存されています.つまり、key=valueの形式です.各クッキーの間は一般に「;」で区切られている.JS設定クッキー: Aページで変数usernameの値(「jack」)をcookieに保存すると仮定し、key値はnameであると仮定すると、対応するJSコードは:document.co okie=「name=」+usernameである.  JS読み取りクッキー: cookieに格納されている内容は、name=jackであると仮定する.password=123 Bページで変数usernameの値を取得するJSコードは以下の通りです. username=document.co okie.split(";)[0].split("=")[1]; //JS操作cookies方法!/cookies functionを書きます set Cookie(name,value){   var Days = 30;   var exp = new Date();   exp.setTime(exp.getTime() + Days*24*60*1000);   document.co okie = name + 「=」+ エスケープ (value) + 「expires=」 + exp.toGMT String()      var stric = getssec(time)   var exp = new Date();   exp.setTime(exp.getTime() + stric*1)   document.co okie = name + 「=」+ エスケープ (value) + 「expires=」 + exp.toGMT String()//読取りcookies function get Cookie(name){   var arr、reg=new RegExp("^| )"+name+「=(^;*)」(;124ドル);    if(arr=document.co okie.match(reg)       return (arr[2])   else      return null;///cookies functionを削除する del Cookie(name){   var exp = new Date();   exp.setTime(exp.getTime() - 1)   var cval=get Cookie(name);   if(cval!=null)      document.co okie= name + "="+cval+「;expires=」+exp.toGMT String()/「使用例set Cookie」(「name」「hayden」);alert(get Cookie(name))、//カスタム期限を設定する必要があれば、上のsetsCookie関数を次の2つの関数に置き換えればOK/プログラム set Cookie(name,value,time){   var stric = getssec(time)   var exp = new Date();   exp.setTime(exp.getTime() + stric*1)   document.co okie = name + "="+ エスケープ (value) + ";expires=" + exp.toGMT String();function getssec(str){  alert(str)  var str 1=str.substring(1、str.length)*1  var str 2=str.substring(0,1)  if (str 2==「s」)  {      return str 1*1000  }  else if (str 2==「h」)  {     return str 1*60*60*1000  }  else if (str 2==「d」)  {     return str 1*24*60*60*1000  }}//これは有効期限が設定されている使用例です./s 20は20秒/hを表しています.12時間であれば、h 12/dは日数、30日であれば、d 30 set Cookie(「name」、「hayden」、「s 20」)です.
--------------------
説明:最近はユーザーが閲覧した製品のページを記録する機能を作りました.お客さんが製品のページに入るたびに、JSを呼び出して、製品情報をjsonの形式でcookieに保存します.閲覧記録の表示はcookieから読んで、jsonに分解して、生成するという考え方です.ユーザーは同時にいくつかのページを開くかもしれません.ページには閲覧記録があるかもしれません.閲覧記録を表示しても、毎秒に一度更新します.2つのjsファイルを使用して、history.js、重要なチャット記録を保存してコードを読み取ります.json.js、jsonを処理します.
http://www.cnblogs.com/qinying/archive/2010/09/15/1826846.html
history.js
   
var addHistory=function(num,id){
    stringCookie=getCookie('history');
    var stringHistory=""!=stringCookie?stringCookie:"{history:[]}";
    var json=new JSON(stringHistory);
    var e="{num:"+num+",id:"+id+"}";
    json['history'].push(e);//        
    setCookie('history',json.toString(),30);
}
//      
var DisplayHistory=function(){
    var p_ele=document.getElementById('history');
     while (p_ele.firstChild) {
      p_ele.removeChild(p_ele.firstChild);
     }
   
    var historyJSON=getCookie('history');
    var json=new JSON(historyJSON);
    var displayNum=6;
    for(i=json['history'].length-1;i>0;i--){
        addLi(json['history'][i]['num'],json['history'][i]['id'],"history");
        displayNum--;
        if(displayNum==0){break;}
    }
}
//    li  
var addLi=function(num,id,pid){
    var a=document.createElement('a');
    var href='product.action?pid='+id;
    a.setAttribute('href',href);
    var t=document.createTextNode(num);
    a.appendChild(t);
    var li=document.createElement('li');
    li.appendChild(a);
    document.getElementById(pid).appendChild(li);
}
//  cookie
var setCookie=function(c_name,value,expiredays)
{
    var exdate=new Date()
    exdate.setDate(exdate.getDate()+expiredays)
    cookieVal=c_name+ "=" +escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
//    alert(cookieVal);
    document.cookie=cookieVal;
}
//  cookie
function getCookie(c_name)
{
    if (document.cookie.length>0)
      {
      c_start=document.cookie.indexOf(c_name + "=")
      if (c_start!=-1)
        { 
        c_start=c_start + c_name.length+1 
        c_end=document.cookie.indexOf(";",c_start)
        if (c_end==-1) c_end=document.cookie.length
//        document.write(document.cookie.substring(c_start,c_end)+"<br>");
        return unescape(document.cookie.substring(c_start,c_end))
        } 
      }
    return ""
}
json.js
   
var JSON = function(sJSON){
    this.objType = (typeof sJSON);
    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);
}
JSON.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;
    }
}
    
   
<script type="text/javascript" src="../js/json.js"></script>
<script type="text/javascript" src="../js/history.js"></script>
<ul id="history">
</ul>
<script> 
addHistory(15810782304,2);
addHistory(64654665,2);
addHistory(6843212,2);
addHistory(84984432521,2);
setInterval("DisplayHistory()",1000);
</script>