js下拉框联动代码
2012-08-03 11:37
357 查看
刚写了一个 这是html 你改一下把 <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> </head> <body > <form name="form" method="post" action="";> <table border="1" style="width: 100%; height: 100%; border-collapse: collapse;"> <tr> <td colspan="2"><span style="font-size: 36pt; color: green">新商品注册</span></td> </tr> <tr> <td width="15%">商品代码:</td> <td width="85%"><input type="text" name="product_no"></input> <font color="red">*</font></td> </tr> <tr> <td>商品名称:</td> <td><input type="text" name="product_name"> </input> <span class="STYLE1"><font color="red">*</font></span> </td> </tr> <tr> <td>一级分类:</td> <td><select name="oneclass" onchange=Change()> <option selected="selected" >--请选择--</option> <option >图书</option> <option >服装</option> <option >饮料</option> <option >电器</option> </select></td> </tr> <tr> <td>二级分类:</td> <td><select name="twoclass"> <option selected="selected">--请选择--</option> </select></td> </tr> <tr> <td>供 应 商:</td> <td><input type="text" name="support"></input> <font color="red">*</font></td> </tr> <tr> <td>厂 商:</td> <td><input type="text" name="company"></input> <font color="red">*</font></td> </tr> <tr> <td>保质期限:</td> <td><input type="text" name="date"></input> <font color="red">*</font></td> </tr> <tr> <td>可否退货:</td> <td><input type="radio" checked="checked" name="tui" value="yes">是</input> <input type="radio" name="tui" value="no">否</input></td> </tr> <tr> <td>可否换货:</td> <td><input type="radio" checked="checked" name="huan" value="yes">是</input> <input type="radio" name="huan" value="no">否</input></td> </tr> <tr> <td>商品备注:</td> <td><textarea name="mess"></textarea> </td> </tr> <tr> <td colspan="2" align="center"><input type="submit" value="确认注册"></input> <input type="reset" value="重新填写"/></td> </tr> </table> </form> </body> 下面这是javascript //定义一个二维数组two,用于存放二级分类名称。 var two=new Array(); two[0]=new Array(); two[1]=new Array(); two[2]=new Array(); two[3]=new Array(); two[4]=new Array(); //赋值,每个一级分类的二级分类存放于数组的一行。 two[0][0]="--请选择--" two[1][0]="--请选择--" two[1][1]="计算机类"; two[1][2]="科学类"; two[1][3]="文学类"; two[1][4]="杂志类"; two[1][5]="法律类"; two[2][0]="--请选择--" two[2][1]="春装"; two[2][2]="夏装"; two[2][3]="秋装"; two[2][4]="冬装"; two[3][0]="--请选择--" two[3][1]="碳酸饮料"; two[3][2]="果汁类"; two[3][3]="牛奶"; two[4][0]="--请选择--" two[4][1]="家用电器"; two[4][2]="商用电器"; function Change() {var i,Index; Index=document.form.oneclass.selectedIndex; iCount=0; while (two[Index][iCount]!=null) iCount++;//计算选定一级分类的二级分类个数 document.form.twoclass.length=iCount;//改变下拉菜单的选项数 for (i=0;i<=iCount-1;i++)//改变下拉菜单的内容 document.form.twoclass[i]=new Option(two[Index][i]); document.form.twoclass.focus(); }
相关文章推荐
- JS年月日三级联动下拉框日期选择代码
- HTML 多个下拉框联动 JS 示例代码(论坛回复摘要)
- 简单的js日期三级联动下拉代码
- 下拉列表多级联动dropDownList示例代码
- js操作二级联动实现代码
- Android实现三级联动下拉框 下拉列表spinner的实例代码
- 本不值一提的东西,省,市两级联动下拉,无刷新.JS+HTML(下)
- 地址选择联动(代码重构后) JS
- JS省市联动菜单代码
- net + js 实现无刷新联动下拉框
- JS 全屏自动 下拉 隐藏代码
- 县级以上联动js实现无需数据库的行政区域下拉控件
- Asp.net WebForm DropDownList 无限极联动(不需要写C#代码,不需要写JS,只是配置属性)
- js入门·表单元素(select下拉列表)制作二级联动菜单和网站导航 .txt
- 省市二级联动 通过省份选择城市 JS的简单应用 二级下拉列表
- 原生js封装二级城市下拉列表的实现代码
- 原生JavaScript实现动态省市县三级联动下拉框菜单实例代码
- 年月日下拉联动代码
- js操纵跨frame的三级联动select下拉选项实例介绍