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

js 三级联动学习记录

2014-03-14 11:36 417 查看

<html>

<head>

<base href="<%=basePath%>">

<title>三级级联</title>

<script type="text/javascript">

var arr = new Array();

arr[1]=new Array("成都",1,1,"");

arr[2]=new Array("绵阳",2,1,"");

arr[3]=new Array("大邑",3,1,"");

arr[11]=new Array("天津市",11,2,"");

arr[4]=new Array("北京市",4,2,"");

arr[5]=new Array("锦江区",5,"",1);

arr[6]=new Array("青羊区",6,"",1);

arr[7]=new Array("高新区",7,"",1);

arr[8]=new Array("和平区",8,"",2);

arr[12]=new Array("和平区1",12,"",3);

arr[13]=new Array("和平区2",13,"",4);

arr[14]=new Array("和平区3",14,"",11);

arr[9]=new Array("沈阳",9,3,"");

arr[10]=new Array("沈阳",10,3,"");

var one;

var two;

var three;

window.attachEvent("onload",initCallPurposeDetailPage);

function initCallPurposeDetailPage()//初始化页面

{

one=document.getElementById("select");

two=document.getElementById("select1");

three=document.getElementById("select2");

}

function a(tValue)

{

if(tValue == 0){

two.length=1;//当我们选择“请选择”时设置全部 select 的大小

}

else{

two.length=1;

three.length=1;

      for(i=1 ; i < arr.length;i++)

   {

       if((arr[i][2]==tValue))    {

     two.options[two.length]=new Option(arr[i][0],arr[i][1]);

    }

   }

}

}

function b(tValue)

{

if(tValue == "0")

{

   three.length=1;//当我们选择“请选择”时设置全部 select 的大小

}

else

{

   three.length=1;

      for(i=1 ; i < arr.length;i++)

   {

       if((arr[i][3]==tValue))

    {

     three.options[three.length]=new Option(arr[i][0],arr[i][3]);

    }

   }

}

}

</script>

</head>

<body>

<form action="" name="form1">

   <select name="select" onchange="a(this.value);">

    <option value="0">

     请选择

    </option>

    <option value="1">

     四川

    </option>

    <option value="2">

     北京

    </option>

     <option value="3">

     辽宁

    </option>

   </select>

   <select name="select1" onchange="b(this.value);">

    <option value="0">

     请选择

    </option>

   </select>

   <select name="select2">

    <option>

     请选择

    </option>

   </select>

</form>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： js 三级联动

相关文章推荐

新的分享

章节导航