Jquery中文网 > 脚本编程 > javascript > 正文 JS联动下拉框代码

JS联动下拉框代码

发布时间：2017-09-26 编辑：www.jquerycn.cn

jquery中文网为您提供 JS联动下拉框代码等资源，欢迎您收藏本站，我们将为您提供最新的 JS联动下拉框代码资源

提示：您可以先修改部分代码再运行

<textarea name="runcool" rows="28" cols="75" > JS联动下拉框代码 <head> <title>JS联动下拉框</title> <meta name="GENERATOR" content="Microsoft FrontPage 4.0"> <meta name="ProgId" content="FrontPage.Editor.Document"> <meta name="Originator" content="Microsoft Visual Studio .NET 7.1"> <script language="javascript" > function CLASS_LIANDONG_YAO(array) { //数组，联动的数据源 this.array=array; this.indexName=''; this.obj=''; //设置子SELECT // 参数：当前onchange的SELECT ID，要设置的SELECT ID this.subSelectChange=function(selectName1,selectName2) { //try //{ var obj1=document.all[selectName1]; var obj2=document.all[selectName2]; var objName=this.toString(); var me=this; obj1.onchange=function() { me.optionChange(this.options[this.selectedIndex].value,obj2.id) } } //设置第一个SELECT // 参数：indexName指选中项,selectName指select的ID this.firstSelectChange=function(indexName,selectName) { this.obj=document.all[selectName]; this.indexName=indexName; this.optionChange(this.indexName,this.obj.id) } // indexName指选中项,selectName指select的ID this.optionChange=function (indexName,selectName) { var obj1=document.all[selectName]; var me=this; obj1.length=0; obj1.options[0]=new Option("请选择地区",''); for(var i=0;i<this.array.length;i ) { if(this.array[i][1]==indexName) { //alert(this.array[i][1] " " indexName); obj1.options[obj1.length]=new Option(this.array[i][2],this.array[i][0]); } } } } <select id="s1" name="s1" > <option selected></option> </select> <select id="s2" name="s2" > <option selected="selected">请选择城市</option> </select>

</body> <script language="javascript"> //例子1------------------------------------------------------------- //数据源 var array=new Array(); array[0]=new Array("华南地区","根目录","华南地区"); //数据格式 ID，父级ID，名称 array[1]=new Array("华北地区","根目录","华北地区"); array[2]=new Array("上海","华南地区","上海"); array[3]=new Array("广东","华南地区","广东"); array[4]=new Array("北京","华北地区","北京"); array[5]=new Array("天津","华北地区","天津"); //-------------------------------------------- //这是调用代码 var liandong=new CLASS_LIANDONG_YAO(array) //设置数据源 liandong.firstSelectChange("根目录","s1"); //设置第一个选择框 liandong.subSelectChange("s1","s2"); //设置子级选择框 </script></textarea>

提示：您可以先修改部分代码再运行

您可能感兴趣的文章：
JS联动下拉框代码
 js 下拉框select联动下拉菜单代码
 Jquery联动下拉菜单实现代码
 js 控制页面跳转的五种方法
 js下拉列表框操作示例总结
 js 获取下拉菜单的值传给文本框
 jQuery JSON实现无刷新三级联动实例探讨
 js日期级联效果的实现代码
 jquery无限层级下拉菜单实现代码
 利用jQuery实现可输入搜索文字的下拉框

上一篇：js 可控制的图片幻灯切换效果下一篇：12个小时弹出一次退弹效果代码

[关闭]

JS联动下拉框代码

最近更新

浏览排行