首先写一个js文件，areaLocation.js:
var
provinceArray=
new
Array()
provinceArray=[
{"pname":"江苏",
"country":[
{
"cname":"南京市",
"town":["玄武区","白下区","秦淮区","建邺区","雨花台","江宁区",
"六合区","溧水县","高淳县"]},
{
"cname":"南通市",
"town":["崇川区","港闸区","启东市","如皋市","通州市","海门市","海安县","如东县"]
},
{
"cname":"苏州市",
"town":["金阊区","沧浪区","平江区","虎丘区","吴中区","张家港","昆山市","吴江市","太仓市"]
}
]
},
{"pname":"上海",
"country":[
{
"cname":"上海市",
"town":["徐汇区","普陀区","杨浦区","虹口区","卢湾区","浦东区","黄浦区","长宁区","闸北区","静安区","闵行区","松江区"]
}
]
}
]
function
areaInitialize(){
province.length=1
for(var
i
=
0i<provinceArray.lengthi++){
var
pro
=
provinceArray[i].pname
province.options[province.length]
=
new
Option(pro,pro)
}
}
function
changeCLocation(id,city){
//alert(id)
city.length
=
0
if(id>0){
var
j=id-1
var
i
var
countrys
=
new
Array()
countrys
=
provinceArray[j].country
city.options[0]
=
new
Option('不限','')
for
(i=0i
<
countrys.length
i++){
var
cname
=
countrys[i].cname
city.options[city.length]
=
new
Option(cname,
cname)
}
changeTLocation(id,1,town)
}else
if(id==0){
city.length
=
0
town.length
=
0
city.options[city.length]
=
new
Option('不限','')
town.options[town.length]
=
new
Option('不限','')
}
}
function
changeTLocation(pid,cid,town){
//alert(cid)
var
countrys
=
new
Array()
var
towns
=
new
Array()
town.length
=
0
var
i
countrys
=
provinceArray[pid-1].country
areaId
=
countrys[cid-1].areaId
towns
=
countrys[cid-1].town
city.options[0]
=
new
Option('不限','')
town.options[0]
=
new
Option('不限','')
for
(i=0i
<
towns.length
i++){
var
tname
=
towns[i]
town.options[town.length]
=
new
Option(tname,tname)
}
town.options[0]
=
new
Option('不限','')
}
2.
再写一个html页面：
<!DOCTYPE
HTML
PUBLIC
"-//W3C//DTD
HTML
4.01
Transitional//EN">
<html>
<head>
<script
type="text/javascript"
></script>
<script
type="text/javascript">
window.onload=areaInitialize()
</script>
</head>
<body>
<select
size="1">
<option
value=0
selected>--请选择--</option>
</select>
<select
size="1"
>
<option
value=0
selected>--请选择--</option>
</select>
<select
size=1>
<option
value=0
selected>--请选择--</option>
</select>
</body>
</html>
<!doctype html><html>
<head>
<meta charset="utf-8"/>
<title>联动</title>
<script>
var cities=[
["杭州","宁波","温州"],
["南京","无锡","苏州"],
["济南","青岛","烟台"]
]
//select.value用来获取下拉选的值
//1.若value没有属性,则它会返回option的内容
//2.若有value属性,则会返回option的value值
function set_city(){
//获取省
var sel1=document.getElementById("province")
console.log(sel1.value)
var pindex=sel1.value
var pcities=cities[pindex-1]
//删除原有的市
var sel2=document.getElementById("city")
sel2.innerHTML="<option>请选择</option>"
//var options=sel2.children
//for(var i=options.length-1i>0i--){
// options[i].remove()
//}
//添加新的城市
for(var i=0i<pcities.lengthi++){
var name=pcities[i]
var option =document.createElement("option")
option.innerHTML=name
sel2.appendChild(option)
}
}
</script>
</head>
<body>
<!-- onchange是值改变事件,只有当值发生
改变后,才会改变 -->
省:
<select onchange="set_city()" id="province">
<option value="0">请选择</option>
<option value="1">浙江省</option>
<option value="2">江苏省</option>
<option value="3">山东省</option>
</select>
市:
<select id="city">
<option>请选择</option>
</select>
</body>
</html>
把最后一句改成这样select_pc('3','1')不过你这代码好像有问题，我少showCity这个函数，我改了一下，如下：
<SCRIPT type=text/javascript>
function provinceRecord(ProvinceDesc, ProvinceCity){
this.Desc = ProvinceDesc
this.city = ProvinceCity
}
var city0 = new Array("请选择")
var ProvinceInfo = new Array()
ProvinceInfo[0] = new provinceRecord("请选择", city0)
var city1 = new Array()
ProvinceInfo[1] = new provinceRecord("天津", city1)
var city2 = new Array( "合肥" )
ProvinceInfo[2] = new provinceRecord("安徽", city2)
var city3 = new Array( "九江" ,"景德镇" )
ProvinceInfo[3] = new provinceRecord("江西", city3)
function showProvince(theProvince){
theProvince.options.length=0
for(i=0i<ProvinceInfo.lengthi++){
theProvince.options[i]= new Option(ProvinceInfo[i].Desc,i)
}
}
function showCity(i,obj)
{
obj.options.length=0
for(n=0n<ProvinceInfo[i].city.lengthn++)
{
obj.options[n]=new Option(ProvinceInfo[i].city[n],n)
}
}
</SCRIPT>
<FORM name="mainform" id="mainform" onSubmit="return test()" action="admin/aduser_fox.php"
method="post" encType="multipart/form-data">
<SELECT onBlur="checkArea(document.mainform.region.value,document.mainform.place2.value)" onFocus="doOnFocus('areaTip')" onChange="showCity(this.selectedIndex, place2)" name="region" id="region">
</SELECT>
<SELECT onBlur="checkArea(document.mainform.region.value,document.mainform.place2.value)" onFocus="doOnFocus('areaTip')" name="place2" id="place2">
<OPTION value="" selected>选择类型</OPTION>
</SELECT>
</FORM>
<SCRIPT language=JavaScript type=text/JavaScript>
var form_obj = document.getElementById("mainform")
showProvince(form_obj.region)
function select_pc(p,c)
{
showCity(p,form_obj.place2)
form_obj.region.value = p
form_obj.place2.value = c
}
select_pc('3','1')//修改这句。
</SCRIPT>
