<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>贵美购物车页面</title> <style type="text/css">
.buyleft{
width:150px;
height:30px;
text-align:right;
font-size:14px;
}
</style>
<script type="text/javascript">
var cityList = new Array();
cityList['北京市'] = ['朝阳区','东城区'];
cityList['玉林'] = ['容县','藤县'];
function change(){
var province=document.getElementById("province").value;
var city=document.getElementById("city");
city.options.length=0; //清除当前city中的选项
for (var i in cityList){
if (i == province){
for (var j in cityList[i]){
city.add(new Option(cityList[i][j],cityList[i][j]),null);
}
}
}
}
function allCity(){
var provi=document.getElementById("province");
var value1=document.getElementById("province").value;
for(var i in value1){
if(i==value1){
for(var j in value[i]){
provi.add(new Option(i,j),null);
//这里的函数有误,请高手指点,实现地址选择的级联郊果
}
}
}
}
window.onload=allCity();
</script>
</head><body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<form action="" method="post" name="myform">
<tr>
<td class="buyleft">地址: </td>
<td><select id="province" onchange="change( )" style="width:100px">
<option>--选择省份--</option>
</select>
<select id="city" style="width:100px">
<option>--选择市/区--</option>
</select>
</td>
</tr>
</form>
</table>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>贵美购物车页面</title> <style type="text/css">
.buyleft{
width:150px;
height:30px;
text-align:right;
font-size:14px;
}
</style>
<script type="text/javascript">
var cityList = new Array();
cityList['北京市'] = ['朝阳区','东城区'];
cityList['玉林'] = ['容县','藤县'];
function change(){
var province=document.getElementById("province").value;
var city=document.getElementById("city");
city.options.length=0; //清除当前city中的选项
for (var i in cityList){
if (i == province){
for (var j in cityList[i]){
city.add(new Option(cityList[i][j],cityList[i][j]),null);
}
}
}
}
function allCity(){
var provi=document.getElementById("province");
var value1=document.getElementById("province").value;
for(var i in value1){
if(i==value1){
for(var j in value[i]){
provi.add(new Option(i,j),null);
//这里的函数有误,请高手指点,实现地址选择的级联郊果
}
}
}
}
window.onload=allCity();
</script>
</head><body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<form action="" method="post" name="myform">
<tr>
<td class="buyleft">地址: </td>
<td><select id="province" onchange="change( )" style="width:100px">
<option>--选择省份--</option>
</select>
<select id="city" style="width:100px">
<option>--选择市/区--</option>
</select>
</td>
</tr>
</form>
</table>
</body>
</html>
这里改成appendChild的方式来添加看看也可以看看这个
http://xxling.com/blog/article/73.aspx源码很简单 可以看一下
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>贵美购物车页面</title> <style type="text/css">
.buyleft{
width:150px;
height:30px;
text-align:right;
font-size:14px;
}
</style>
<script type="text/javascript">
var cityList = new Array();
cityList['北京市'] = ['朝阳区', '东城区'];
cityList['玉林'] = ['容县', '藤县'];
function change() {
var province = document.getElementById("province").value;
var city = document.getElementById("city");
var arr = cityList[province];
city.options.length = 0; //清除当前city中的选项
for (var i = 0; i < arr.length; i++) city.options.add(new Option(arr[i], arr[i]));
/*for (var i in cityList) {
if (i == province) {
for (var j in cityList[i]) {
city.add(new Option(cityList[i][j], cityList[i][j]), null);
}
}
}*/
}
function allCity() {
var provi = document.getElementById("province");
var value1 = document.getElementById("province").value;
for (attr in cityList) provi.options.add(new Option(attr, attr));
/*for (var i in value1) {
if (i == value1) {
for (var j in value[i]) {
provi.options.add(new Option(i, j), null);///////
//这里的函数有误,请高手指点,实现地址选择的级联郊果
}
}
}*/ } window.onload = allCity////////();
</script>
</head><body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<form action="" method="post" name="myform">
<tr>
<td class="buyleft">地址: </td>
<td><select id="province" onchange="change( )" style="width:100px">
<option>--选择省份--</option>
</select>
<select id="city" style="width:100px">
<option>--选择市/区--</option>
</select>
</td>
</tr>
</form>
</table>
</body>
</html>