php教程+網頁特效實現三級聯動菜單
<!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>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
