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

（JavaScript）案例一：二级联动

2015-09-02 21:47 651 查看

<!doctype html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="Generator" content="EditPlus®">

<meta name="Author" content="">

<meta name="Keywords" content="">

<meta name="Description" content="">

<title>Document</title>

<script type="text/javascript">

var arr1 = ["选择英雄类型","战士","法师","坦克","射手"];

arr2 = [

['lol'],

["潘森","奥拉夫"],

["卡牌","流浪"],

["狗熊","龙龟"],

["艾希","vn"],

];

window.onload = function select(){

obj1st = document.getElementById('select1');

obj1st.length = arr1.length;

for (i=0;i<arr1.length ;i++ )

{

obj1st.options[i].text = arr1[i];

}

obj1st.onchange = function select2(){

var obj2nd = document.getElementById('select2');

obj2nd.length = arr2[obj1st.selectedIndex].length;

for (j=0;j<arr2[obj1st.selectedIndex].length ;j++ )

{

obj2nd.options[j].text = arr2[obj1st.selectedIndex][j];

}

}

}

</script>

</head>

<body>

<select id="select1" onclick="select()"></select>

<select id="select2" onchange="select2()"></select>

</body>

</html>

效果如图：

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

标签：

相关文章推荐

新的分享

章节导航