您的位置:首页 > Web前端 > JavaScript

php+javascript实现三级联动(二)

2011-07-18 18:50 309 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
<!--
var prov = data.province;
var city = data.city;
var area = data.area;

function change(v)
{
var str = 0;
var val = 0;
if(v>0)
{
Obj = document.getElementById('s'+v);
val = Obj.options[Obj.selectedIndex].value;
}

var obj = document.getElementById(s[v]);
with(obj)
{
length = 0;
options[0] = new  Option(opt0[v],opt0[v]);
var $arr = get(v,val);
for(var key in arr)
{
options[length] = new Option(arr[key],key);
}
if(v && options[1])options[1].selected = true;
if(++v < s.length)change(v);
}

}

function get(index ,val)
{
var value = "";
if(index == 0)
{
value = prov;
}else if(index == 1){
value = city;
}else if(index == 2){
value = area;
}

var t = new array();
if(val == 0)
{
return value;
}else {
for (var k in value)
if(k.substr(0,val.length) == val)
{
t[k] = value[k];
}
return t;
}

}
var s = ["s1","s2","s3"];
var opt0 = ["-选择-省市-","-选择-城市-","-选择-城区-"];
function setup()
{
for(i=0;i<s.length-1;i++)
{
document.getElementById(s[i]).onchange = new Function("change("+(i+1)+")");
change(0);
}
}
//-->
</script>
</head>
<body onload="setup();">
<select id="s1"><option>-选择-省市-</option></select>
<select id="s2"><option>-选择-城市-</option></select>
<select id="s3"><option>-选择-城区-</option></select>

</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: