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,我是华丽丽的分割线-------------------------------------------------------

欢迎交流,尊重原创,转载请注明出处哦~


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/386099.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

web开发者工具,你必须知道的CSS盒模型,架构师必备!

前言 不要为了面试而去背题&#xff0c;匆匆忙忙的&#xff0c;不仅学不进去&#xff0c;背完了几天后马上会忘记。 你可能会说&#xff0c;“没办法&#xff0c;这不是为了能找份工作嘛&#xff01;”。我想说的是&#xff0c;“那你没开始找工作的时候&#xff0c;咋不好好…

web开发要学多久,HTML表格标签,薪资翻倍

前言 作为一个程序员&#xff0c;当然总是期望自己的代码能「一次编写&#xff0c;四处运行」&#xff0c;但真实经验往往是「一处修改&#xff0c;百处填坑」&#xff0c;依赖落后了好几个版本了想要升级、老代码已经看着很不爽了打算重构&#xff0c;都需要下坚决的决心&…

js含有特定文字不能跳转

<html> <head> <script type"text/javascript"> function checkUpload() { for(var i0;i<document.files.filename.length;i){ if(document.files.filename[i].value"未选择文件"){alert("请检查要上传的文件是否全部添加!"…

web开发课程培训,10大前端常用算法,学习路线+知识点梳理

标签语义化&#xff1a; 语义和默认样式的区别&#xff1a; 默认样式是浏览器设定的一些常用tag的表现形式&#xff1b;语义化的主要目的就是让大家直观的认识标签和属性的用途和作用&#xff1b; 标签语义化作用&#xff1a; 当只有HTML页面时&#xff0c;没有CSS&#xf…

web开发课程,CSS标准文档流与脱离文档流,已整理成文档

前言 年前准备换工作&#xff0c;总结了一波面试最频繁的面试问题跟大家交流。此文章是关于浏览器的常见问题&#xff0c;大概面试10家遇到6家提问类似问题&#xff08;主要是大厂和中厂&#xff09;。目前入职滴滴出行成都团队。 前端核心 1.JSONP的缺点 2.跨域&#xff08…

jQuery学习笔记(一)——基础选择器、过滤选择器、表单选择器

$()就是jQuery中的函数&#xff0c;它的功能是获得&#xff08;&#xff09;中指定的标签元素。如示例中$(“p”)会得到一组P标签元素,其中“p”表示CSS中的标签选择器。$()中的()不一定是指定元素&#xff0c;也可能是函数。 在jQuery中 $()方法等价于jQuery()方法,前者比较常…

web开发课程,HTML常用的五种标签,附赠课程+题库

标准文档流 标准文档流&#xff0c;指的是元素排版布局过程中&#xff0c;元素会默认自动从左往右&#xff0c;从上往下的流式排列方式。前面内容发生了变化&#xff0c;后面的内容位置也会随着发生变化。 HTML就是一种标准文档流文件 HTML中的标准文档流特点通过两种方式体现…

jQuery学习笔记(二)—— 操作DOM元素

使用attr()方法控制元素的属性 attr()方法的作用是设置或者返回元素的属性&#xff0c;其中attr(属性名)格式是获取元素属性名的值&#xff0c;attr(属性名&#xff0c;属性值)格式则是设置元素属性名的值。 例如&#xff0c;使用attr(属性名)的格式获取页面中<a>元素的“…

web开发软件,8个优秀的CSS实践,附面试题

一.为什么要学习前端开发&#xff1f; 你可能是因为兴趣&#xff0c;完成一个网站、页面、功能的成就感。你也可能是因为现在前端岗位火爆&#xff0c;就业率高。不管是因为什么&#xff0c;只要找准了目标&#xff0c;学就是了&#xff01; 突破困境&#xff1a; 1. 提升学…

jQuery 学习笔记(三)——事件与应用

页面加载时触发ready()事件 ready()事件类似于onLoad()事件&#xff0c;但前者只要页面的DOM结构加载后便触发&#xff0c;而后者必须在页面全部元素加载成功才触发&#xff0c;ready()可以写多个&#xff0c;按顺序执行。此外&#xff0c;下列写法是相等的&#xff1a; $(docu…

web开发软件,HTML如何添加锚点,成功入职阿里

前言 正式学习前端大概 3 年多了&#xff0c;接触前端大概 4 年了&#xff0c;很早就想整理这个书单了&#xff0c;因为常常会有朋友问&#xff0c;前端该如何学习&#xff0c;学习前端该看哪些书&#xff0c;我就讲讲我学习的道路中看的一些书&#xff0c;虽然整理的书不多&a…

cs硕士妹子找工作经历【阿里人搜等互联网】

摘自 北邮人论坛 分享他人成功的求职经历。原文如下&#xff1a; 唉&#xff0c;妹子本来是本着写面经的态度与大家分享&#xff0c;之自己情况也是想说明一啥都不会的菜鸟在悲催的逆境下也可以凭自身努力找到offer&#xff0c;没想到被评为作秀。。。妹子能力背景确实和说的…

web开发项目,web前端CSS全局样式,面试必问

前言 表格是网页制作中使用最多的工具之一&#xff0c;在制作网页时&#xff0c;使用表格可以更清晰地排列数据。但是在实际制作过程中&#xff0c;表格更多用在网页布局的定位上。很多网页都是以表格布局的。这是因为表格在文本和图像的位置控制方面都有很强的功能。 字节跳…

Java中key可以重复的Map集合:IdentityHashMap

范例&#xff1a;Map中的key不允许重复&#xff0c;重复就是覆盖 [java] view plaincopy package org.lxh.demo13.mapdemo; import java.util.HashMap; import java.util.Iterator; import java.util.Map; import java.util.Set; class Person { …

牛客网笔记之数组(一)

最近开始在“牛客网”上做题&#xff0c;希望通过日积月累&#xff0c;每天记录一点小知识&#xff0c;每天前进一小步。 今天练习的题目关于数组。 1. 数组存储&#xff1a;链式存储、顺序存储 线性表逻辑上是线性的&#xff0c;存储上可以是顺序的&#xff0c;可以是链式的…

社交网络节点理论

1.顿巴数 每个人的朋友圈子对多能达到150个人。&#xff08;密友3-5人&#xff0c;好友30-50人&#xff0c;其他100-150人&#xff09;纵使高科技带来的人际圈越来越大&#xff0c;但是人脑的容量是有限的&#xff0c;你也不可能和这么多人维持一定的人际关系&#xff08;没有人…

疯狂涨知识!Java多态实现原理技术总监都拍手叫好

##前言 多态是Java语言重要的特性之一&#xff0c;它允许基类的指针或引用指向派生类的对象&#xff0c;而在具体访问时实现方法的动态绑定。Java对于方法调用动态绑定的实现主要依赖于方法表&#xff0c;但通过引用调用&#xff08;invokevitual&#xff09;和接口引用调用&am…

国内互联网公司算法机器学习岗(阿里星)面试总结

从2015年8月到2015年10月&#xff0c;花了3个月时间找工作&#xff0c;先后通过内推参加了美团、阿里蚂蚁金服、京东、腾讯、今日头条、Growing IO、微软这7个公司的面试&#xff0c;同时参加了网易游戏、LinkedI In中国这2个公司的笔试&#xff0c;拿到比较优质的offer是京东S…

疯狂涨知识!「高并发秒杀」微信抢红包实战案例帮你突破瓶颈

推荐阅读&#xff1a; 阿里二面凉经&#xff1a;设计模式缓存Spring虚拟机MySQL中间件并发等难题&#xff0c;全部迎刃而解阿里巴巴字节跳动那些大厂必问的HTTP该怎么学&#xff1f;我建议你看看这篇文章&#xff01;蚂蚁、字节、PDD社招面经Java岗&#xff08;分布式线程安全…

2016面试——腾讯、蚂蚁金服、蘑菇街

腾讯TST技术面&#xff1a; 先罗列一下问题吧: 编程语言编译的过程 同样的逻辑,golang的二进制代码比C语言的二进制代码长很多.试分析原因 项目 ,三个项目都有聊.因为现场面,可以用纸写,所以描述的更清楚些 N * N的方格纸,里面有多少个正方形 两个数组求交集 什么样的…