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

以下是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>

时间: 2024-10-12 06:41:26

简单js代码实现selece二级联动(推荐)_javascript技巧的相关文章

js代码实现selece二级联动

 这篇文章主要介绍了简单js代码实现selece二级联动的简单实例.需要的朋友可以过来参考下,希望对大家有所帮助 以下是html代码:   代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML>  <HEAD>   <TITLE> New Document </TITLE>   <META NAME="Generat

最简单js代码实现select二级联动下拉菜单_javascript技巧

本文实例为大家分享了js实现select二级联动下拉菜单,供大家参考,具体内容如下 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.

js实现的下拉框二级联动效果_javascript技巧

本文实例讲述了js实现的下拉框二级联动效果.分享给大家供大家参考,具体如下: <script language="JavaScript" type="text/javascript"> <!-- /* * 说明:将指定下拉列表的选项值清空 * 转自:Gdong Elvis ( http://www.gdcool.net ) * * @param {String || Object]} selectObj 目标下拉选框的名称或对象,必须 */ fun

这段js代码得节约你多少时间_javascript技巧

1.应用案例: 复制代码 代码如下: var Mouse = function () { // Look! no that = this! this.position = [0, 0]; if (document.addEventListener) { document.addEventListener('mousemove', ?); //this.move? } else if (document.attachEvent) { document.attachEvent("onmousemov

JS代码实现table数据分页效果_javascript技巧

第一个:实现的很常见很简单的显示页数翻页 效果图: •这是HTML代码,很简单滴(我好像看到了被嫌弃的小眼神) <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-"> <script src="js/jquery-...js"></script> <script src="js/demo.js

给应用部分的js代码设定一个统一的入口_javascript技巧

javascript是种脚本语言,浏览器下载到哪儿就会执行到哪儿,这种特性会为编程提供方便,但也容易使程序过于凌乱,支离破碎. js从功能上可以分为两大部分--框架部分和应用部分,框架部分提供的是对js代码的组织作用,包括定义全局变量.命名空间方法等,每个页面都会有相同或类似的框架.应用部分提供的是页面功能逻辑,不同页面会有不同的功能,不同页面应用部分的代码也不尽相同. 给应用部分的js代码一个统一的入口,即: 复制代码 代码如下: <script type="text/javascrip

js添加事件的通用方法推荐_javascript技巧

js添加事件的通用方法推荐 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <p id="p1">测试添加事件:firefox使用addEventListener,ie使用attachEvent<br> 点击此p标签,绑定了2个弹

不到30行JS代码实现Excel表格的方法_javascript技巧

本文实例讲述了不到30行JS代码实现Excel表格的方法,可见jQuery并非不可替代.分享给大家供大家参考.具体分析如下: 某国外程序员展示了一个由原生JS写成不依赖第三方库的,Excel表格应用,有以下特性: ① 由不足30行的原生JavaScript代码实现 ② 不依赖第三方库 ③ Excel风格的语义分析 (公式以 "=" 开头) ④ 支持任意表达式 (=A1+B2*C3) ⑤ 防止循环引用 ⑥ 基于localStorage的自动本地持久化存储 效果展示如下图所示: 代码分析:

原生js代码实现图片放大境效果_javascript技巧

今天我给大家分享一下自己用js写的一个图片放大器效果,我做了两种效果的放大,其实它们的原理都差不多,都是采用了两张图片给两张图片设定相应的尺寸,最后显示在不同位置,最终实现放大效果. 第一种是我仿照淘宝购物页面的一个放大镜效果,当鼠标移动到商品图片上时,图片上会出现一个矩形区域,而这个区域就是你要放大的区域,然后商品图片的右侧会出现一个放大后的商品图片.这种放大方式只需要你计算好放大的比例,然后通过修改放大区域的scrollLeft和scrollTop值实现相应的放大效果. <!DOCTYPE