jsp+js实现二级级联
本文实现学院-专业二级级联,同理可用到省份-城市,洲-国家等级联,即通过不同的首选择,自动找到属于第一选择的二次可选项。
test.jsp
<%@ page language="java" contentType="text/html; charset=gb2312" import="java.util.*" pageEncoding="UTF-8"%><% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><base href="<%=basePath%>"><title>级联</title><script type="text/javascript" src="js/selectMajor.js"></script></head> <body> <div><form action="./reader/Personinfo_showgo.jsp" name="form" method="post">学院:<select name="readerSchool" id="readerSchool" onChange="changeMajor()"><option>--请选择学院--</option><option value="1">通信与信息工程学院</option><option value="2">光电工程学院</option><option value="3">经济管理学院</option><option value="4">计算机科学与技术学院</option><option value="5">外国语学院</option><option value="6">生物信息学院</option><option value="7">法学院</option><option value="8">自动化学院</option><option value="9">体育学院</option><option value="10">数理学院</option><option value="11">传媒艺术学院</option><option value="12">软件学院</option><option value="13">国际半导体学院</option><option value="14">国际学院</option><option value="15">研究生院</option></select>专业:<select name="readerMajor" id="readerMajor" onChange="myfun1()"><option>--请选择专业--</option></select> </form> </div></body> </html>
selectMajor.js
function changeMajor(){//JS中的数组可以采用标识符代替//根据用户选择的value值,与数组下标比较,从而找出学院对应的专业var school=document.form.readerSchool.value;var majorList=new Array();majorList['1']=['通信工程','电子信息工程','信息工程','广播电视工程','通信与信息类','通信与信息类实验班','通信学院卓越工程师班','通信学院IT精英班','通信学院国际实验班','电子信息工程(通信技术)','电子信息工程(应用电子技术)','电子信息工程(实验班)'];majorList['2']=['光信息科学与技术','电子科学与技术','电磁场与无线技术','电子工程类','电子工程实验班'];majorList['3']=['信息管理与信息系统','会计学','经济学','市场营销','工商管理','电子商务','工程管理','信息管理类','工商管理类','物流管理','国际化会计人才培养实验班','工商管理实验班','经济学实验班','市场营销专业实验班'];majorList['4']=['计算机科学与技术','地理信息系统','网络工程','信息安全','智能科学与技术','计算机智能科学类','计算机智能科学类实验班','计算机科学与技术(计算机应用)','计算机科学与技术(网络技术)','计算机科学与技术(信息安全)','计算机科学与技术(实验班)'];majorList['5']=['英语','英语类','英语(商贸)'];majorList['6']=['生物医药工程','生物技术','制药工程','生物信息学','生物技术与制药类','生物技术(生物信息学方向)','生物制药类实验班'];majorList['7']=['法学','知识产权学','法学类'];majorList['8']=['自动化','测控技术与仪器','电气工程与自动化','机械设计制造及其自动化','物联网工程','自动化与电气工程类','自动化与电气工程类实验班','自动化学院卓越工程师班','电气工程与自动化(电气技术)','电气工程与自动化(电机电器)','电气工程与自动化(实验班)'];majorList['9']=['社会体育'];majorList['10']=['应用物理学','信息与计算科学','数学与应用数学','信息显示与光电技术','数理科学与信息技术类','数理科学与信息技术基础班','信息与计算科学专业实验班'];majorList['11']=['广播电视编导','动画','环境设计','视觉传达','艺术设计(网络)','艺术设计类','编导改革实验班'];majorList['12']=['软件工程','软件工程(2年)','英语+软件','日语+软件','软件工程类'];majorList['13']=['电子科学与技术','微电子学','集成电路工程类','集成电路工程类实验班','微电子科学与工程实验班'];majorList['14']=['英语(中加)'];majorList['15']=['通信与信息工程','电子与信息工程','计算机科学与技术','计算机技术','软件工程','先进制造技术'];document.form.readerMajor.options.length=0;//根据学院下拉框的值,获取对应数组的索引标识var pIndex=document.form.readerSchool.value;var newOption;document.form.readerMajor.options.length=0;//清除选项//数组的读取和数字索引方式相同 for(var j in majorList[pIndex]){newOption=new Option(majorList[pIndex][j],majorList[pIndex][j]);document.form.readerMajor.options.add(newOption);//动态添加选项} }
----------------------------------------------------hi,我是华丽丽的分割线-------------------------------------------------------
欢迎交流,尊重原创,转载请注明出处哦~
jsp+js实现二级级联相关推荐
- Jsp+javascript打造二级级联下拉菜单
数据库需求分析: class(一级栏目信息):classId(自动编号),className(栏目名称) Nclass(二级栏目信息):NclassId(自动编号),NclassName(栏目名称), ...
- jsp下拉框传到html下拉框,在一个jsp页面实现二级下拉框联动
在一个jsp页面实现二级下拉框联动,实时读取数据库数据. 在一个jsp页面实现二级下拉框联动,实时读取数据库数据,这个方法非常使用,只需要修改很小的地方就可以使用.设计的文件,serch.jsp,ma ...
- vue 左侧菜单隐藏_vue.js 左侧二级菜单显示与隐藏切换的实例代码?
郎朗坤 废话不多说了,直接给大家贴代码了,完整代码: vue点击切换显示隐藏 {{item.name}} {{subItem.name}} 以上所述是小编给大家介绍的vue.js 左侧二级菜单显示与隐 ...
- 前端---二级级联下拉列表的实现
写在前面:本是一前端小白,奈何工作需要,不得不硬着头皮上,但是感觉费劲又慢,光是一个小小的二级级联的东西就弄个半天,愁!特此总结! 前端代码: <select id="select1& ...
- Excel的二级级联以及多级级联的实现
Excel的二级级联多级级联的实现 实现步骤: 1.创建一个新的sheet页作为数据来源的sheet 2.以杭州市作为行政区为例,将对应的区街道写入到数据来源sheet中 3.选中需要校验的的列设置数 ...
- java+ jsp+js 实现富文本编辑和上传图片功能
java+ jsp+js 实现富文本编辑和上传图片功能 使用kindeditor富文本插件: - kindeditor富文本官网地址 详细的文档和demo都有 下面是实现步骤: -导入项目中相关的文件 ...
- 基于javaweb的高校运动会管理系统(java+ssm+jsp+js+jquery+mysql)
基于javaweb的高校运动会管理系统(java+ssm+jsp+js+jquery+mysql) 运行环境 Java≥8.MySQL≥5.7.Tomcat≥8 开发工具 eclipse/idea/m ...
- 基于javaweb的社区居民户籍管理系统(java+ssm+jsp+js+html+mysql)
基于javaweb的社区居民户籍管理系统(java+ssm+jsp+js+html+mysql) 运行环境 Java≥8.MySQL≥5.7.Tomcat≥8 开发工具 eclipse/idea/my ...
- Excel 2019:二级级联下拉框设置
Execl 2019:二级级联下拉框 场景需求 实现效果展示 二级级联设置步骤 1.填写基础信息 2.设置一级数据验证 3.设置依赖于一级选择的二级下拉内容 场景需求 当我们需要规范输入的数据时,会用 ...
最新文章
- 比特币现金(BCH)独立日一周年庆!里程碑一览!
- linux挂载一个新的硬盘
- 图:DFS(深度优先搜索)图解分析代码实现
- ieee文章作者对不齐怎么办呢?
- c语言常用二个标准库函数
- android tasker,Tasker:Android系统增强神器
- 7-2 合并两个有序数组为新的有序数组 (15 分)
- java.lang.ClassNotFoundException: org.apache.jsp.WEB_002dINF.views.login_jsp
- AtomicBoolean介绍与使用
- BERT源码分析PART II
- linux xfs字体服务安装6,Linux系统中安装中文字体方法
- Illustrator 教程,如何在 Illustrator 中添加文本段落?
- 系统计算机名是中文,导致VisualSVN安装失败
- 本文来自合作伙伴“阿里聚安全”.
- Linux系统下查看网卡相关数据
- 信息学奥赛一本通网站
- 理解和应用向量积与数量积
- 消消乐游戏算法实现(三消乐)
- 科技的性感:三星冰洗如何演绎时尚生活?
- PTA天天练(大于身高的平均值 )
热门文章
- ajax eval html,Ajax eval的应用示例
- druid连接池初始化慢_7、SpringBoot -连接池(Durid)
- php cpu mac,PHP 获得计算机的唯一标识[CPU,网卡 MAC地址]
- java 切面 不执行,解决springboot的aop切面不起作用问题(失效的排查)
- c# mysql 插入 和 查询_C#对数据库的操作(增删改查)
- C语言字符像素,返回字符串宽度 (以像素为单位)
- 如何在Java中检查对象是否为空?
- Java String startsWith()方法与示例
- bfs广度优先搜索算法_图的广度优先搜索(BFS)
- TomCat使用以及端口号被占用的处理方法