简单js代码实现selece二级联动(推荐)


Posted in Javascript onFebruary 18, 2014

以下是html代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>
<!-- by sundful  starting-->
 <BODY>
  <script   language="JavaScript">       var   subcat   =   new   Array();     
  subcat[0]   =   new   Array('中文','英语','英语')     
  subcat[1]   =   new   Array('中文','法语','法语')        
  subcat[2]   =   new   Array('英语','中文','中文')     
  subcat[3]   =   new   Array('法语','中文','中文')         
  function   changeselect1(locationid)     
  {     
  document.form1.s2.length   =   0;   //初始化下拉列表   清空下拉数据     
  document.form1.s2.options[0]   =   new   Option('==请选择==','');   //给第一个值     
  for   (i=0;   i<subcat.length;   i++)   //legth=20     
  {     
  if   (subcat[i][0]   ==   locationid)   //[0]   [1]   第一列   第二列     
  {document.form1.s2.options[document.form1.s2.length]   =   new   Option(subcat[i][1],   subcat[i][2]);}   //建立option     
  //第一次   length=1   因为有==请选择==     
  //i=9时   length=   10   值有11个   因为从0数起   subcat[i][0]   ==   locationid屏蔽了再写     
  }     
  }     
  </script>     
  <form   name="form1"     method="post"   runat="server">     
  二级联动:     
  <select   name="s1"   onChange="changeselect1(this.value)">     
  <option>==请选择==</option>     
  <option   value="中文">中文</option>     
  <option   value="英语">英语</option> 
  <option   value="英语">法语</option> 
  </select>       
  <select   name="s2">     
  <option>==请选择==</option>     
  </select>     
  </form> 
<!-- by sundful  ending-->  
 </BODY>
</HTML>
Javascript 相关文章推荐
javascript中的onkeyup和onkeydown区别介绍
Apr 28 Javascript
js动态修改整个页面样式达到换肤效果
May 23 Javascript
使用jquery修改表单的提交地址基本思路
Jun 04 Javascript
JavaScript实现同步于本地时间的动态时间显示方法
Feb 02 Javascript
JS中cookie的使用及缺点讲解
May 13 Javascript
Vue单页应用引用单独的样式文件的两种方式
Mar 30 Javascript
angular6 利用 ngContentOutlet 实现组件位置交换(重排)
Nov 02 Javascript
Vuex的API文档说明详解
Feb 05 Javascript
JavaScript实现留言板案例
Mar 17 Javascript
vue-i18n实现中英文切换的方法
Jul 06 Javascript
axios封装与传参示例详解
Oct 18 Javascript
Vue深入理解插槽slot的使用
Aug 05 Vue.js
超简单JS二级、多级联动的简单实例
Feb 18 #Javascript
jquery easyui中treegrid用法的简单实例
Feb 18 #Javascript
DIV始终居中的js代码
Feb 17 #Javascript
jquery实现邮箱自动补全功能示例分享
Feb 17 #Javascript
JQuery与JS里submit()的区别示例介绍
Feb 17 #Javascript
按Enter键触发事件的jquery方法实现代码
Feb 17 #Javascript
清除div下面的所有标签的方法
Feb 17 #Javascript
You might like
新52大事件
2020/03/03 欧美动漫
dedecms集成财付通支付接口
2014/12/28 PHP
PHP结合jQuery.autocomplete插件实现输入自动完成提示的功能
2015/04/27 PHP
Zend Framework入门应用实例详解
2016/12/11 PHP
laravel框架路由分组,中间件,命名空间,子域名,路由前缀实例分析
2020/02/18 PHP
汉化英文版的Dreamweaver CS5并自动提示jquery
2010/11/25 Javascript
jsp网页搜索结果中实现选中一行使其高亮
2014/02/17 Javascript
js获取元素相对窗口位置的实现代码
2014/09/28 Javascript
JS验证逗号隔开可以是中文字母数字
2016/04/22 Javascript
Bootstrap字体图标无法正常显示的解决方法
2016/10/08 Javascript
Ajax 加载数据 练习代码
2017/01/05 Javascript
通过实例了解js函数中参数的传递
2019/06/15 Javascript
react实现antd线上主题动态切换功能
2019/08/12 Javascript
前端性能优化建议
2020/09/17 Javascript
python3图片转换二进制存入mysql
2013/12/06 Python
分享一个常用的Python模拟登陆类
2015/03/29 Python
Python实现把回车符\r\n转换成\n
2015/04/23 Python
django的ORM模型的实现原理
2019/03/04 Python
python manage.py runserver流程解析
2019/11/08 Python
python文件编写好后如何实践
2020/07/07 Python
如何利用python进行时间序列分析
2020/08/04 Python
CSS 说明横向进度条最后显示文字的实现代码
2020/11/10 HTML / CSS
HTML高亮关键字的实现代码
2018/10/22 HTML / CSS
乌克兰第一的珠宝网上商店:Gold.ua
2019/11/29 全球购物
C# .NET面试题
2015/11/28 面试题
任课老师推荐信范文
2013/11/24 职场文书
正规的求职信范文分享
2013/12/11 职场文书
企业党员公开承诺书
2014/03/26 职场文书
教师节宣传方案
2014/05/23 职场文书
公益广告标语
2014/06/19 职场文书
在职证明格式样本
2015/06/15 职场文书
红白喜事主持词
2015/07/06 职场文书
2015年暑期社会实践方案
2015/07/14 职场文书
爱国主义教育主题班会
2015/08/13 职场文书
会计继续教育培训心得体会
2016/01/19 职场文书
导游词之云南丽江古城
2019/09/17 职场文书