最近花了3天得时间做了一个栏目定制功能，代码都很简单，先保存在此，备忘 1.函数
  /**//* ----------------------------------coustom Class-------------------------------------------------------------- */
var Coustom=Class.create();
Coustom.prototype= {
  initialize:function(){
 this.cookie=new Cookie();
this.localArray=this.cookie.format;
this.length=this.localArray.length;
 },
getURLpages:function(){ //获得定制页面内容，priavted
this.localArray.each(function(value,index){
var frameName=templatePre+index;
try{
this._getFrame(frameName,index)
}
catch(e){
}
}.bind(this))
},
_getFrame:function(frameName,index){ //@priavted获得栏目得页面内容，
var frame=$(frameName);
var array=this.localArray[index];
array.each(function(value,index){
this._getPageContext(frame,array[index]);
}.bind(this));
},
_getPageContext:function(frame,index){ //@priavted获得远程页面内容，priavted
var PageItem= this._getPageitem(index);
var div=document.createElement('div');
div.id=PageItem.name;
frame.appendChild(div);
var url=PageItem.url;
var myAjax=new Ajax.Updater(
div.id,
url,
{method:"GET",
parameters:""
});
},
_getPageitem:function(index){ //@priavted获得模版得页面信息
var templateIndex="Lable"+index;
eval("var page=mytemplate."+templateIndex);
return page;
},
/**//*-------------------------*/
setMycoustom:function(){ //设置我得本地栏目定制
for(var i=0;i<this.length;i++){
var selectColumn=templatePre+i;
var selectName=selectColumn+"_select";
var selectElement=$(selectName);
this.cookie.format[i]= this._SetCoustominCookie(selectElement);
}
this.cookie.SetValue("format",this.cookie.format.join("!"),1);
},
_SetCoustominCookie:function(selectElememt){//@priavted
var array=new Array();
for(var i=0;i<selectElememt.length-1;i++){
array[i]= selectElememt.options[i].value;
}
return array;
},
getCoustom:function(){ //获取本地得页面定制配置
for(var i=0;i<this.length;i++){
var divname=templatePre+i;
this._getSelectContext(divname,i);
}
},
_getSelectContext:function(item,index){//@priavted获得栏目得选择内容
var array= this.localArray[index];
var selectElememt=document.createElement('select');
var name=item+"_select";
selectElememt.id=item+"_select";
selectElememt.size=5;
selectElememt.multiple =true;
try{ for(var i=0;i<array.length;i++){
var page=this._getPageitem(array[i]);
var oValue=array[i];
var oText=page.name;
selectElememt.options[i]= new Option(oText, oValue, false, false);
} }catch(e){}
selectElememt.options[selectElememt.length]=new Option("--------------","spacer",false,false);
var div=$(item);
div.appendChild(selectElememt);
}
 }
/**//* ----------------------------------cookie Class-------------------------------------------------------------- */
var Cookie=Class.create();
Cookie.prototype={
initialize:function(){
this.format=[];
if(this.GetValue("format")==null)
{ this.SetValue("format",defaultformat.join("!"),1);
this.format=defaultformat;
}
else
{var array=this.GetValue("format").split("!");
for(var i=0;i<array.length;i++){
this.format[i]=array[i].split(",");
}
}
},
SetValue:function(name,value,hours,path,domain,secure){ //设置cookie值
var str=new String();
var nextTime=new Date();
nextTime.setHours(nextTime.getHours()+hours);
str=name+"="+escape(value);
if(hours)
str+=";expires="+nextTime.toGMTString();
if(path)
str+=";path="+path;
if(domain)
str+=";domain="+domain;
if(secure)
str+=";secure";
document.cookie=str;
},
GetValue:function(name){ //得到cookie值
var rs=new RegExp("(^|)"+name+"=([^;]*)(;|$)","gi").exec(document.cookie),tmp;
if(tmp=rs)
return unescape(tmp[2]);
return null;
}
}
/**//* ----------------------------------util function------------------------------------ */
function arrangeContentProvider( direction, columnID ) {
var column=columnID-1;
var columnname =templatePre+column+"_select";
var multi = 0; //判断是否多选择了元素
var selectElement=$(columnname);
for (var i = 0; i < selectElement.length; i++) {
if (selectElement.options[i].selected) {
if(multi == 0) {
multi = 1;
} else {
alert("Please select one channel at a time");
return true;
}
}
}
selection = selectElement.selectedIndex;
if (selection != -1 &&selectElement.options[selection].value != "spacer") {
oText = selectElement.options[selection].text;
oValue = selectElement.options[selection].value;
if (selection > 0 && direction == 0) { //方向得实现: 0==向上
selectElement.options[selection].text =selectElement.options[selection-1].text;
selectElement.options[selection].value=selectElement.options[selection-1].value;
selectElement.options[selection-1].text = oText;
selectElement.options[selection-1].value = oValue;
selectElement.selectedIndex--;
}
else if (selection < selectElement.length-2 && direction == 1) { //方向向下
selectElement.options[selection].text=selectElement.options[selection+1].text;
selectElement.options[selection].value = selectElement.options[selection+1].value;
selectElement.options[selection+1].text = oText;
selectElement.options[selection+1].value = oValue;
selectElement.selectedIndex++;
}
}
else return false;
}
function switchColumns( sourceColumnID, destinationColumnID ) {
var srcColumn=sourceColumnID-1;
var desColumn=destinationColumnID-1;
var srcName=templatePre+srcColumn+"_select";
var desName=templatePre+desColumn+"_select";
var srcselectElement=$(srcName);
var desselectElement=$(desName);
selection = srcselectElement.selectedIndex;
if (selection != -1 && srcselectElement.options[selection].value != "spacer") {
oText = srcselectElement.options[selection].text;
oValue =srcselectElement.options[selection].value;
destinationLength = desselectElement.length;
srcselectElement.options[selection] = null;
desselectElement.options[destinationLength] = new Option(oText, oValue, false, false);
desselectElement.selectedIndex = desselectElement.length-1;
arrangeContentProvider(0,destinationColumnID)
}
else return false;
}2.模版
var defaultformat=[[0,1,2,3],[4,5,6,7,8,9,10],[11,12,13]];
var templatePre="trs_template_";
var mytemplate={
Lable0:{name:"办事指南",url:"/coustom/IndexAction.do?templatepath=bszn"},
Lable1:{name:"受理机构",url:"/coustom/IndexAction.do?templatepath=sljg"},
Lable2:{name:"上海概览",url:"/coustom/IndexAction.do?templatepath=shgl"},
Lable3:{name:"民意调查百姓评价",url:"/coustom/IndexAction.do?templatepath=mydc"},
Lable4:{name:"表格下载",url:"/coustom/IndexAction.do?templatepath=bgxz"},
Lable5:{name:"上海地图",url:"/coustom/IndexAction.do?templatepath=shdt"},
Lable6:{name:"便民回答",url:"/coustom/IndexAction.do?templatepath=bmhd"},
Lable7:{name:"公众热键",url:"/coustom/IndexAction.do?templatepath=gzrj"},
Lable8:{name:"服务导航",url:"/coustom/IndexAction.do?templatepath=fwdh"},
Lable9:{name:"城市生活",url:"/coustom/IndexAction.do?templatepath=cssh"},
Lable10:{name:"政策法规",url:"/coustom/IndexAction.do?templatepath=zcfg"},
Lable11:{name:"网上服务",url:"/coustom/IndexAction.do?templatepath=wsfw"},
Lable12:{name:"每日更新",url:"/coustom/IndexAction.do?templatepath=mrgx"},
Lable13:{name:"实用信息查询",url:"/coustom/IndexAction.do?templatepath=syxx"}
}
3。主页面
<META http-equiv=Content-Type content="text/html; charset=UTF-8">
<SCRIPT SRC="prototype.js"></SCRIPT>
<SCRIPT SRC="template.js"></SCRIPT>
<SCRIPT SRC="tmfunction.js"></SCRIPT>
<SCRIPT language=JavaScript>
<!--
var cookie=new Cookie();
var arrayformat=[]; //栏目分组二为数组
dealCookie(arrayformat);
//-->
</SCRIPT>
</HEAD>
<!--~========================= END DOCUMENT HEADER =========================~-->
<BODY bgColor=#ffffff leftMargin=0 topMargin=0 onload="new Coustom().getCoustom()">
4。定制页面
<SCRIPT SRC="prototype.js"></SCRIPT>
<SCRIPT SRC="template.js"></SCRIPT>
<SCRIPT SRC="tmfunction.js"></SCRIPT>
<SCRIPT language=JavaScript>
var cookie=new Cookie(); //全局cookie变量
var arrayformat=[]; //栏目分组二为数组
dealCookie(arrayformat);
</script>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
</HEAD>
<BODY text=#000000 bgColor=#264989 leftMargin=0 topMargin=0 onload="getLocal()">
<META http-equiv=Pragma content=no-cache>
<META http-equiv=Cache-control content=no-cache>
<!--BODY ONLOAD=setWindowName(); BGCOLOR="#ffffff" leftMargin=0 rightMargin=0 topMargin=0 marginheight="0" marginwidth="0"-->
|