保存跨页面选择的数据

使用JAVASCRIPT操作COOKIE保存跨页面选择的数据，原理很简单：使用javascript把选中的数据写入cookie和一个隐藏控件(这样服务器端也可获取到选中的数据了)，避免选中的数据在url上传递，带来潜在的危险。
在这个例子里最重要的是JS，如何获取数据和分页与JS实现方法是无关的，当然需要把Chebox控件的值设为要保存的数据。

<% @ Page Language = " C# "  AutoEventWireup = " true "  CodeBehind = " SaveValueOfMultiPages.aspx.cs "  Inherits = " test.DEMO.SaveValueOfMultiPages "   %>

<! DOCTYPE html PUBLIC  " -//W3C//DTD XHTML 1.0 Transitional//EN "   " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >

< html xmlns = " http://www.w3.org/1999/xhtml "   >
< head runat = " server " >
     < title > 多页面选择值 </ title >
     < script language = " JAVASCRIPT "  type = " text/JavaScript " >
        var splitCharacter  =  [ {id:1,name:"doll"} , {id:2,name:"doll;"} , {id:3,name:"doll="} , {id:4,name:"#ff0000"} ]; 
        
        var ObjSelectValue ; // 获取存放选中值的控件对象
        var ObjCheckBox ; // 获取CheckBox对象集合
        window.onload  =  function()
         {
            ObjSelectValue = getObjByID("HdSelectedValues");  
            ObjCheckBox = getObjByName("ckBox");          
            CheckIn(getSelectValue());
        } ;
  
         // 初始化选中信息
        function CheckIn(cookies) 
         {  
           for(var i=0;i<ObjCheckBox.length;i++)
           {        
                if(cookies.split(ObjCheckBox[i].value + ",").length > 1)
                {   
                      ObjCheckBox[i].checked = true;
                  }
           }
        }         
         // 添加或移出选中的值        
        function AddOrRemoveValues(objCkBox) 
         {  
            if(objCkBox.checked)
            { 
                var cookies = document.cookie;
                if(cookies.split(splitCharacter[1].name).length == 1)
                {
                    if(cookies.split(splitCharacter[0].name).length > 1)
                    {
                        cookies = getSelectValue();    
                        if(cookies.split(",").length > 10) //如果超过10个就不让选择，并提示
                        {
                           alert("最多只能对比10个!");
                           objCkBox.checked = false;
                           return;
                        }
                        if(cookies.split(splitCharacter[3].name).length > 1)
                        {
                            cookies = cookieStr.replace(splitCharacter[3].name,"");
                        }
                    }
                }           
               ObjSelectValue.value += objCkBox.value + ",";   
            }
            else
            {
                 ObjSelectValue.value = ObjSelectValue.value.replace(objCkBox.value+",","");
            }
            document.cookie = splitCharacter[2].name+ObjSelectValue.value;  
        }     

         // 清除选中的值
        function clearSelectValue() 
         {           
           var cookies = getSelectValue();
           for(var i=0;i<ObjCheckBox.length;i++)
           {            
                if(cookies.split(ObjCheckBox[i].value+",").length > 1)
                {   
                      ObjCheckBox[i].checked = false;
                  }
           }
           document.cookie = splitCharacter[2].name + "null";
           ObjSelectValue.value = "";
           alert("数据清空完成");
       }
           
         // 获取选中的值
        function getSelectValue () 
         { 
            var ReturnValue = "";   
            var CookieString = document.cookie.split(splitCharacter[2].name);
               if(CookieString.length > 1)   
            { 
                var CookieArray = CookieString[1].split(';'); 
                if(CookieArray.length>0)
                {
                    ReturnValue = CookieArray[0];   
                }
            }
            else
            {
                ReturnValue = "";
            }
            if(ReturnValue.indexOf(",") != -1)
            {
                ObjSelectValue.value = ReturnValue;
            }
            return ReturnValue;  
        }
        function getObjByID(objID)
         {
            return document.getElementById(objID);
        }
        function getObjByName(objName)
         {
            return document.getElementsByName(objName);
        }
     </ script >
</ head >
< body >
     < form id = " form1 "  runat = " server " >
     < div >
     < input type = " button "  value = " clear check value "  onclick = " clearSelectValue(); " >
      < table width = " 70% "  height = " 36 "  border = " 1 "  cellpadding = " 0 "  cellspacing = " 0 " >
         < tr >
             < td width = " 40px " > check </ td >
             < td width = " 50% "  align = " left " > ShipName </ td >
             < td align = " left " > ShipAddress </ td >
         </ tr >
         < asp:Repeater ID = " Repeater1 "  runat = " server " >
         < ItemTemplate >
         < tr >
             < td >< input onclick = " AddOrRemoveValues(this) "  value = " <%# Eval( " OrderID " ) %> "  name = " ckBox "  type = " checkbox "   /></ td >
             < td align = " left "  width = " 50% "   ><% # Eval( " ShipName " )  %></ td >
             < td align = " left "   ><% # Eval( " ShipAddress " )  %></ td >
             </ tr >
         </ ItemTemplate >
         </ asp:Repeater >  
        
      </ table >  
     </ div >
         < asp:Literal ID = " ltPage "  runat = " server " ></ asp:Literal >
         < input type = " hidden "  id = " HdSelectedValues "   />
     </ form >
</ body >
</ html >