Question

【请求帮助】如何在discuz分类信息这个摸块里添加；省市关联的下拉选框？

问题一；如何discuz分类信息这个摸块里添加省市关联的下拉框？比如；我选择省份的广东；地区自动出现；广州。深圳，潮州，梅州，汕头。佛山，中山，东莞；江门，惠州。珠海。肇庆；这样的下拉选框；问题二；如何设置，自定义分类信息的样式？请帮助。谢谢；

Answer 1

为了考虑在同一个页面中多处使用，因些使用了对象的思想进行设计，为了实现各个多级联动的内容不同，所以把内空数据结构与程序进行了分离，因此设计最终调用方法如：
　var city=new LightManAddressTree;
　city.selectshow(obj,0);　//obj为要添加到的dom结点，
　如有html代码如下<div id="abc"></div>
那么调用方法就应该为
obj=document.getElementById("abc");
　var city=new LightManAddressTree;
　city.selectshow(obj,0);
这样多级联动内容就为显示在闭合的div标签内的位置
　其js设计代码如下：
复制代码 代码如下:
//定义地址数据开始
var AddressTree={};
AddressTree["a_row"]=new Array(); //存所有记录
with(AddressTree){
a_row["1"]=["北京市",0,1];
a_row["2"]=["上海市",0,1];
a_row["3"]=["天津市",0,1];
a_row["4"]=["重庆市",0,1];
a_row["5"]=["河北",0,0];
a_row["6"]=["山西",0,0];
a_row["7"]=["内蒙古",0,0];
a_row["8"]=["辽宁",0,0];
a_row["9"]=["吉林",0,0];
a_row["10"]=["黑龙江",0,0];
a_row["11"]=["江苏",0,0];
..............
}
var j=0;
AddressTree["a_record"]=new Array();//存储记录的记录号
for(i in AddressTree["a_row"]){AddressTree["a_record"][j++]=i;}
AddressTree.ObjNumber=1;
//地址选择构造函数
function LightManAddressTree(){
var Data = AddressTree; //数据记录数据变量
this.noselectshow=["--请选择省份--","--请选择城市--","--请选择区县--"];//各级不选择显示值
this.grade=0; //级数
this.idvalue=0; //地址选择值的id号
this.text=""; //地址字符串
this.listseparator=" "; //地址字符串中的分隔符号
this.selectName="a_tree"+(AddressTree.ObjNumber++)+"_";
//定义地址数据结束
this.getfontpath = function(id){ //取得指定记录号的上级路径
var path = "",upid;
try{
upid=(isNaN(id)?0:id);
while(upid!=0){
var upid=Data["a_row"][upid][1];
if(path!="")path=upid+","+path;else path=upid;
}
}
catch(e){};
return eval("["+path+"]");
}
//建立下列表
this.selectshowlevel=function(obj,upid,def){
var selectobj,optionobj,havedef;
selectobj=document.getElementById(this.selectName+this.grade);
if(selectobj){
document.getElementById(this.selectName+this.grade).options.length=0;
}else{
selectobj=document.createElement("select");
selectobj.id=this.selectName+this.grade;
selectobj.grade=this.grade;
selectobj.obj=this;
selectobj.onchange=function(){
if(this.options[this.selectedIndex].value!=""){
this.obj.selectshow(obj,this[this.selectedIndex].value);
}
else{
if(this.obj.grade>0){
for(var i=this.grade+1;i<this.obj.grade-1;i++){
var df=document.getElementById(this.obj.selectName+i);
df.options.length=0;
defaultoption(this.obj,df,i);
}
//最得值
getvalue(this.obj);
}
}
}
}
defaultoption(this,selectobj,this.grade);
//显示级别下数据
if(upid>=0){
for(var j=0;j<Data["a_record"].length;j++){
thisrecord=Data["a_row"][Data["a_record"][j]];
if(thisrecord[1]==upid){
optionobj=document.createElement("option");
optionobj.text=thisrecord[0];
optionobj.value=Data["a_record"][j];
selectobj.options.add(optionobj);
if(def==Data["a_record"][j]) havedef=true;
}
}
}
if(havedef)selectobj.value=def;
return selectobj;
}
this.selectshow = function(obj,id){ //显示选中记录号
var selectobj,optionobj,thisrecord;
var lastgrade,tempid=id,tempgrade;
var fontpath=this.getfontpath(id);
tempgrade=this.grade;
this.grade=0;
//显示选中前部分内容
for (var i=0;i<fontpath.length;i++){
if(!document.getElementById(this.selectName+this.grade)){
if(i<fontpath.length-1)
this.Add(obj,this.selectshowlevel(obj,fontpath[i],fontpath[i+1]));
else
this.Add(obj,this.selectshowlevel(obj,fontpath[i],id));
}
this.grade++;
}
//显示选中后部分内容
do{
lastgrade=this.selectshowlevel(obj,tempid);
tempid=lastgrade.value;
if (tempid=="")tempid=-1;
this.Add(obj,lastgrade);
this.grade++;
}
while(lastgrade.options.length>0);
//删除多余选项
for(i=this.grade-1;i<tempgrade-1;i++){
obj.removeChild(document.getElementById(this.selectName+i));
}
//最得值
getvalue(this);
}
this.Add=function(obj,s){
if(s.options.length>0&&!document.getElementById(s.id))obj.appendChild(s);
}
//获取选择值
function getvalue(obj){
var sel
obj.text="";
obj.idvalue=0;
for(var i=0;i<obj.grade-1;i++){
sel=document.getElementById(obj.selectName+i);
if(sel.value!=""){
obj.text+=(obj.text.match("\\S")==null?"":obj.listseparator)+sel.options[sel.selectedIndex].text;
obj.idvalue=sel.options[sel.selectedIndex].value;
}else{break;}
}
}
//级别显示数据
function defaultoption(obj,sobj,g){
try{
if(obj.noselectshow[g]){
optionobj=document.createElement("option");
optionobj.text=obj.noselectshow[g];
optionobj.value="";
sobj.options.add(optionobj,0);
}
}
catch(e){}
}
} address_test.htm
复制代码 代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
" http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<script type="text/javascript" src="Address.js"></script>
</body>
</html> 本文来自: 脚本之家(www.jb51.net) 详细出处参考： http://www.jb51.net/article/9790.htm希望对你有帮助