用prototype实现的简单小巧的多级联动菜单

//author:downpour
varDoubleCombo=Class.create();
DoubleCombo.prototype={
initialize:function(source,target,ignore,url,options,excute){
this.source=$(source);
this.target=$(target);
this.ignore=$A(ignore);
this.url=url;
this.options=$H(options);
this.source.onchange=this.doChange.bindAsEventListener(this);
if(excute){
this.doChange();
}
},
doChange:function(){
if(this.source.value!=''){
//firstcleartheignoreones
this.ignore.each(
function(value){
$(value).options.length=1;
$(value).options[0].selected='selected';
}
);
//createparameterforajax
varquery=$H({id:this.source.value});
varparameters={
method:'post',
parameters:$H(this.options).merge(query).toQueryString(),
onComplete:this.getResponse.bindAsEventListener(this)
}
varlocationRequest=newAjax.Request(this.url,parameters);
}
},
getResponse:function(request){
this.target.options.length=1;
this.target.options[0].selected='selected';
varresponse=$A(request.responseText.trim().split(';'));
response.length--;
for(vari=0;ivaroptionParam=response[i].split(',');
this.target.options[this.target.options.length]=newOption(optionParam[1],optionParam[0]);
}
}
}
简单说一下几个参数吧：
source第一级菜单
target联动菜单
ignore当有时候3级联动时，例如国家省市例如上海没有省的，可以忽略第3级菜单
urlactionurl
optionsaction参数
excute是否联动
拿比较常见的例子来看国家省市3级联动来作为例子
代码




--PleaseSelect--
................


--PleaseSelect--
................


newDoubleCombo('country','province',null,'',{});

newDoubleCombo('province','city',null,'',{});