<html>
<head></head>
<body>
<script>
//创建两个字符串
var sx = "[{'levelId':100101,'levelName':'坐席'},{'levelId':100102,'levelName':'团队长'},{'levelId':100103,'levelName':'部经理'}]";
var fw = "[{'levelId':100201,'levelName':'市场经理'},{'levelId':100202,'levelName':'市场经理助理'}]";
function changeEmpType(empTypeId){
document.getElementById("level").options.length = 0;
var ob = 0;
//根据人员类别决定将要把那种对象数组里面的值写入第二个SELECT中
if(empTypeId == '1001'){
//将字符串装换为对象并赋值
ob = eval("("+sx+")");
}else if(empTypeId == '1002'){
//将字符串装换为对象并赋值
ob = eval("("+fw+")");
}
var option = new Option("请选择",0);
if(ob != 0){
for(var j in ob){
option = new Option(ob[j].levelName,ob[j].levelId);
document.getElementById("level").options.add(option);
}
}else{
document.getElementById("level").options.add(option);
}
}
</script>
<select name="empType" id="empType" onchange="changeEmpType(this.value)">
<option>请选择</option>
<option value="1001">销售系列</option>
<option value="1002">服务系列</option>
</select>
<select name="level" id="level">
<option>请选择</option>
</select>
</body>
</html>
-------------------------------------------------------------------------------------
<html>
<head></head>
<body>
<script>
//创建两种类型的对象数组,sx对应销售系列,fw对应服务系列
var sx = [{'levelId':100101,'levelName':'坐席'},{'levelId':100102,'levelName':'团队长'},{'levelId':100103,'levelName':'部经理'}];
var fw = [{'levelId':100201,'levelName':'市场经理'},{'levelId':100202,'levelName':'市场经理助理'}];
function changeEmpType(empTypeId){
document.getElementById("level").options.length = 0;
var ob = 0;
//根据人员类别决定将要把那种对象数组里面的值写入第二个SELECT中
if(empTypeId == '1001'){
ob = sx;
}else if(empTypeId == '1002'){
ob = fw;
}
var option = new Option("请选择",0);
if(ob != 0){
for(var j in ob){
option = new Option(ob[j].levelName,ob[j].levelId);
document.getElementById("level").options.add(option);
}
}else{
document.getElementById("level").options.add(option);
}
}
</script>
<select name="empType" id="empType" onchange="changeEmpType(this.value)">
<option>请选择</option>
<option value="1001">销售系列</option>
<option value="1002">服务系列</option>
</select>
<select name="level" id="level">
<option>请选择</option>
</select>
</body>
</html>
分享到:
相关推荐
在使用JSP JavaScript过程中有很多的技巧与实现,那么如何构建二级级联下拉菜单呢,本文将会向你做一个源码上的介绍。
JSP+JavaScript打造二级级联下拉菜单 简单的很哪 嘿嘿
用JSP+JavaScript打造二级级联下拉菜单
洲和国家二级级联菜单,基于asp+javascript+sql数据库
主要介绍了javascript实现二级级联菜单的简单制作,感兴趣的小伙伴们可以参考一下
javascript 二级联动菜单
二级级联菜单在我去年的时候就用asp+js做过,而现在忽然拿出来再做的时候我发现我忘记了,而且原来用asp写的程序都找不到了,真晕[emot]sweat[/emot],于是到网上搜,找了半天,我发现网上的写法各异,而且都特别...
洲、国家、地区(省份)三级级联菜单,基于asp+javascript+sql数据库 。 本篇中还包括最近发布过的二级级联菜单源码
1、javascript实现二级联动:运用jsp标签拼写Javascript代码,实现一个二维数组,点击一级栏目时,查询二维数组里,符合一级栏目的value ,放到二级栏目里 2,ajax实现的二级联动:利用Ajax与后台程序实现异步交互...
本文实例为大家分享了Javascript实现二级联动菜单效果的对应代码,具体内容如下 效果图如下: 具体实现步骤如下: 1.所用js代码如下: [removed] var arr_province=["请选择省份/城市","北京市","上海市","天津市...
主要介绍了JavaScript实现的级联算法,结合省市二级联动下拉菜单功能实例分析了javascript事件响应与元素动态操作实现级联算法的相关技巧,需要的朋友可以参考下
一个强健 实用的ajax二级联动菜单(有演示和附源程序打包下载) 前些天在搞后台的时候要用到二级联动的菜单,到网上去找了半天也没找到满意的,不是这错就是那错,在选择的时候有时候不能返回.真是郁闷. 后来就看到有人...
本文实例讲述了php+mysql实现的二级联动菜单效果。分享给大家供大家参考,具体如下: <!... <... ...生成学院专业级联下拉菜单测试 <...** 功 能: php+mysql+javascript实现学院专业二级级联下拉框 ** 数据
菜单资源保存在数据库中。利用了jquery的ajax实现。用到的包有:json-lib-2.2.3-jdk15.jar ezmorph-1.0.6.jar json.js jquery.js jsp页面的代码: 代码如下: <%@ page contentType=”text/html; charset=gbk...
本文实例讲述了js实现全国省市二级联动下拉选择菜单,分享给大家供大家参考。具体如下: 效果图: 具体代码: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb...
运用HTML、CSS以及Javascript相关知识,编写多窗口多菜单的内容联动。 考察学生关于frame、浏览器对象,以及表单控件的概念,javascript事件触发机制和程序设计, 以及用CSS来组织文字展示的掌握程度,使学生对DHTML...
javascript 常用的特效: 1。DIV套表格布局页面 2、网页左侧实现带关闭按钮、随...4、职位按地区搜索,实现级联的二级下拉列表框 10、左侧的功能菜单下的超链接,实现对应网页右侧相对层的显示、隐藏效果 。。。。。。
支持多级子菜单的展开菜单,由JavaScript代码实现的多级菜单,第一个是竖向排列,向右展开的菜单,下边那个是向下展开,二级再向右展开的多级联动菜单,在IE8下测试通过,其它浏览器环境下未做测试,应该也可以吧,...