下拉列表框级联
.
.
.
.
<!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=utf-8" /> <title>歌手及歌曲查询</title> <script type="text/javascript"> var singers = new Array(); //歌手数组 singers["周杰伦"] = ["菊花台","蜗牛","夜的第七章"]; singers["许巍"] = ["时光","两天","彩虹","礼物"]; singers["黑鸭子合唱组"] = ["今天是你的生日","算逑歌"]; //为歌手列表添加值 function SetSinger(){ var singer = document.getElementById("singer"); //获得歌手列表框对象 for(var index in singers){ singer.options.add(new Option(index,index)); } SetMusic(); } //修改歌曲列表中的值 function SetMusic(){ var singer = document.getElementById("singer"); //获得歌手列表框对象 var music = document.getElementById("Music"); //获得歌曲列表框对象 music.length = 0; //清空下拉列表 for(var index in singers[singer.value]){ music.options.add(new Option(singers[singer.value][index],singers[singer.value][index])); } } </script> </head> <body onload="SetSinger()"> <p> <label> 歌手: <select name="singer" id="singer" onchange="SetMusic()"> </select> </label> </p> <p> <label> 歌曲: <select name="Music" id="Music"> </select> </label> </p> </body> </html>
作者:dybai
出自:https://0xcafebabe.cnblogs.com
赞赏:3Ky9q5HVGpYseBPAUTvbJBvM3h3FQ3edqr(BTC)
本作品采用知识共享署名-相同方式共享 3.0 中国大陆许可协议进行许可。
欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。
posted on 2011-06-06 15:49 0xCAFEBABE 阅读(1610) 评论(0) 编辑 收藏 举报