- 浏览: 269066 次
- 性别:
- 来自: 江西
文章分类
最新评论
-
hiben:
[list][*][list][*][*][*][/list] ...
多数据源的配置和切换 -
bqmcjl:
大哥。我项目里边怎么没有AbstractRoutingData ...
多数据源的配置和切换 -
zhouchuang:
y
java中的分页处理 -
hm2008:
...
父母不会站在原地等你 (推荐) -
tamsiuloong:
简单是简单 效率相当低
最简单的java 克隆实现
最近做页面时,碰到js级联下拉框显示的问题。先用下拉框选择大类,小类选项由大类的选项决定自动生成。我的js 代码如下:
在解决这个问题时主要是怎么组织这个数据结构,我是利用了js 的Map 来进行迭代。从而解决了这个问题的。
var classidList=[ {'100':'旅游度假','subList':{'100001':'旅游资讯','100002':'旅行预定','100003':'旅行线路','100004':'机票预定','100005':'酒店预订','100006':'旅行社','100007':'热门景点','100008':'交通地图','100009':'天气','100010':'旅游门户'}}, {'101':'医疗健康','subList':{'101001':'健康资讯','101002':'医疗','101003':'保健','101004':'两性健康','101005':'心理健康','101006':'医学','101007':'医药','101008':'医院','101009':'健康门户'}}, {'102':'教育招聘','subList':{'102001':'教育资讯','102002':'人才招聘','102003':'论文','102004':'课件','102005':'学习/培训','102006':'留学','102007':'外语','102008':'同学录','102009':'大学','102010':'网校','102011':'考试','102012':'教育门户'}},{'103':'消费购物','subList':{'103001':'消费资讯','103002':'购物','103003':'美食','103004':'时尚','103005':'摄影','103006':'美容','103007':'鞋帽','103008':'服装服饰','103009':'男士','103010':'女性','103011':'育儿','103012':'行业网站'}}, {'104':'网络服务','subList':{'104001':'搜索','104002':'垂直搜索','104003':'P2P','104004':'软件下载','104005':'在线翻译','104006':'网站导航','104007':'免费主页','104008':'桌面媒体','104009':'网络硬盘','104010':'网络电话'}}, {'105':'社区交友','subList':{'105001':'聊天','105002':'论坛','105003':'播客','105004':'社区','105005':'博客','105006':'综合交友','105007':'婚恋交友','105008':'商务交友','105009':'维客'}}, {'106':'娱乐休闲','subList':{'106001':'游戏','106002':'影视','106003':'音乐','106004':'动漫','106005':'明星','106006':'宠物','106007':'贺卡','106008':'视频','106009':'爱情','106010':'图片','106011':'星座','106012':'笑话幽默','106013':'娱乐门户'}}, {'107':'新闻门户','subList':{'107001':'综合门户','107002':'新闻门户','107003':'地方信息港','107004':'政府公务','107005':'电视','107006':'广播电台','107007':'报刊'}}, {'108':'IT数码','subList':{'108001':'IT资讯','108002':'电脑教程','108003':'硬件','108004':'软件','108005':'电脑考试','108006':'数码','108007':'程序设计','108008':'笔记本','108009':'LINUX','108010':'站长资源','108011':'IT门户'}}, {'109':'体育运动','subList':{'109001':'奥运','109002':'足球','109003':'篮球','109004':'排球','109005':'乒乓球','109006':'网球','109007':'体育报刊','109008':'棋牌','109009':'游泳','109010':'羽毛球','109011':'户外','109012':'赛车F1','109013':'体育门户'}}, {'110':'文化艺术','subList':{'110001':'文学','110002':'艺术','110003':'历史','110004':'军事','110005':'社科','110006':'名人'}}, {'111':'财经法律','subList':{'111001':'证券','111002':'彩票','111003':'银行','111004':'汽车','111005':'房产','111006':'保险','111007':'商业','111008':'理财','111009':'广告','111010':'会计','111011':'法律','111012':'财经门户'}} ]; //设置小类所对应的Map值; function setSubClass(province) { var subClassMap; for(i=0;i<classidList.length;i++){ var classMap = classidList[i]; for(var prop in classMap){ if(prop==province){ subClassMap=classMap['subList']; } } } setSelectOption('site_sub_class', subClassMap, '-请选择小类-'); } //根据大类的改变,相应小类进行初始化。 function setSelectOption(selectObj, optionList, firstOption, selected) { if (typeof selectObj != 'object') { selectObj = document.getElementById(selectObj); } removeOptions(selectObj); var start = 0; if (firstOption) { selectObj.options[0] = new Option(firstOption, ''); start ++; } for(var prop in optionList){ selectObj.options[start] = new Option(optionList[prop], prop); if(selected == prop) { selectObj.options[start].selected = true; } start ++; } } //清除子类选项 function removeOptions(selectObj) { if (typeof selectObj != 'object') { selectObj = document.getElementById(selectObj); } var len = selectObj.options.length; for (var i=0; i < len; i++) { selectObj.options[0] = null; } } //初始化 var mainClassid = document.getElementById('site_main_class'); //读取大类并添加到大类选择中 for(iter=0;iter<classidList.length;iter++) { var classMap = classidList[iter]; for(var prop in classMap){ if(prop!='subList'){ mainClassid.options.add(new Option(classMap[prop],prop)); } } }
在解决这个问题时主要是怎么组织这个数据结构,我是利用了js 的Map 来进行迭代。从而解决了这个问题的。
发表评论
-
spring quartz 任务调度
2011-07-07 15:29 1124最简单的配置如下:默认是一分钟执行一次 <bean i ... -
spring、hibernate等开源框架svn源码地址
2011-02-10 08:58 4065很多优秀的开源项目已经提供SVN源码签出,下面是各源码的svn ... -
eclipse启动错误:JVM terminated. Exit code=-1
2009-12-02 10:08 2209在eclipse.ini文件的开始增加下列vm的设置。下面是我 ... -
weblogic8.1的ejb服务问题
2009-09-27 10:11 1342在宁夏电信的开发中,发现在调用weblogic8.1的ejb服 ... -
3des的加解密过程
2009-09-03 22:10 2374请看代码,这是3Des最简单的加解密过程: /** * ... -
多数据源的配置和切换
2009-02-06 11:13 7779[color=green] 项目中用到过多数据源之间的切换,从 ... -
js checkbox 全选 全不选 代码
2008-12-17 14:32 2445/* *obj 当前对象(this) *cName 子选项名称 ... -
最简单的java 克隆实现
2008-09-25 17:23 5240先定义一个标准的javabean对象,并实现持久化接口 请看代 ... -
java 代理机制实现
2008-09-25 15:56 2311Proxy 模式 代理的主要类:java.lang.re ... -
ant脚本(部署应用)
2008-09-04 18:27 2678最近在部署应用时,遇到一个问题,就是ant脚本登录到linux ... -
struts+spring+sitemesh下的中文乱码问题
2008-04-14 17:25 2748最近有个项目用struts+spring+sitemesh做的 ... -
spring jdbcTemplate 操作接口使用
2008-04-10 22:56 3431import java.sql.CallableState ... -
spring jdbcTemplate 实现批量更新操作接口使用
2008-04-10 22:52 16609批量更新操作使用如下代码: public int[] up ... -
struts下的分页实现
2008-04-10 13:24 1583ActionForm 基类 BaseForm的代码如下: ... -
java中的正则表达式
2007-10-29 11:00 2007如果你曾经用过Perl或任何其他内建正则表达式支持的语言,你一 ... -
spring AOP
2007-08-09 16:39 1620这是在网上发现的一篇关于Spring AOP编程的教程,读完这 ... -
Tomcat内存设置从windows服务启动不生效?
2007-08-09 16:24 8704... -
java中用URLConnection 类post方式提交表单
2007-07-02 09:43 29774/** * <pre> * Title: ... -
转贴hibernate2.1与hibernate3.0的区别
2007-03-09 16:03 4484尽管Hibernate 3.0 与Hibernate2.1的源 ... -
各种数据库的jdbc驱动下载及连接方式
2007-03-07 16:46 35127各种数据库驱动 ...
相关推荐
实现级联下拉框效果,我们通常需要两个或多个`<select>`元素,并通过JavaScript监听第一个下拉框的`change`事件。当用户更改选择时,触发事件处理函数,根据选定的值动态更新第二个下拉框的选项。 以下是一个简单的...
级联下拉框是一种常见的用户界面元素,常用于在多个相关选项之间建立关联,例如国家、省份、城市的三级选择。这种交互方式可以帮助用户快速浏览和选择层级结构中的数据,而无需打开多个独立的下拉菜单。在网页开发或...
在JavaScript和XML结合使用生成级联下拉框的场景中,我们通常会处理多级选择的交互,这种交互常见于地址选择或者分类筛选等。级联下拉框是指当用户在一个下拉框中做出选择后,另一个下拉框的内容会根据用户的选择...
在网页开发中,级联下拉框(Cascading Dropdown)是一种常见的交互设计,它用于在两个或更多下拉框之间建立关联,当用户在一个下拉框中选择一个选项时,其他下拉框的选项会根据所选内容动态更新。在本案例中,我们将...
本项目“ajax + servlet 两级动态级联下拉框”旨在演示如何使用AJAX(异步JavaScript和XML)技术和Servlet进行交互,以实现在选择第一个下拉框的值后,第二个下拉框自动更新并显示相关数据。以下是对这个项目的详细...
**Ajax 实现可配置无刷新级联下拉框** 在 Web 开发中,为了提供用户友好的交互体验,级联下拉框(Cascading Dropdown)是一个常见的需求。级联下拉框允许用户在一个下拉框中选择一个选项后,根据所选的选项动态更新...
在Vue.js 2.0版本中,select级联下拉框是前端界面中常见的一种交互方式,它能够根据上一级选择的值来动态更新下一级的选项内容。本文将介绍如何在Vue.js 2.0中创建并实现动态级联select的功能,并讨论单选和多选在...
级联下拉框是一种常见的前端交互元素,常用于表示层级关系的数据选择,如地区选择(国家-省份-城市)、组织架构选择(公司-部门-小组)等。在这些场景中,用户选择一个选项后,下拉框会动态更新,显示与前一选择相关...
这是一个利用了Ajax技术的一个Jquery实例,动态的生成级联的下拉列表框,在中关村zol中经常可以看到。如果遇到无法显示的情况,请自己阅读代码。
### js+xml生成级联下拉框代码解析 在网页开发中,级联下拉框是一种常见的用户界面元素,尤其在需要根据某个选择动态更新其他选项的场景中非常有用,例如根据用户选择的省份来显示相应的城市列表。本文将详细介绍...
JSON(JavaScript Object Notation)和Select元素在网页开发中经常被用来构建动态的、交互式的用户界面,特别是在处理级联下拉框时。级联下拉框是指一个下拉框的选择会影响另一个下拉框的选项,这样的设计可以提高...
在Web开发中,级联下拉列表是一种常见的交互方式,它允许用户在选择一个选项后,根据选择自动更新另一个下拉列表。在这个“ajax+struts2.0+jsp下拉列表级联”的示例中,我们将探讨如何利用这三个技术实现这种功能。 ...
在JavaScript编程中,省市级联(也称为级联下拉框)是一种常见的用户界面功能,用于展示层次结构的数据,如省份和城市。这种交互方式在网页表单中常见,允许用户选择一个省份后,自动加载并显示该省份下的城市选项。...
4. **JSON数据处理**:Servlet或Controller将JSON数据返回给前端,JSP页面接收到数据后,使用JavaScript(可能配合jQuery或其他库)解析JSON并动态生成城市下拉菜单的选项。 5. **AJAX交互**:使用jQuery的`$.ajax...
<script src="https://code.jquery.com/jquery-3.6.0.min.js"> $(document).ready(function() { $('#category').on('change', function() { var categoryId = $(this).val(); $.get('ld.php', { category_id: ...
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。在本案例中,后台使用Struts1.2框架生成的JSON数据结构应当包含各级别下拉列表的选项信息,例如: `...
级联选择器,通常被称为级联下拉框或树形下拉菜单,是一种常见的用户界面元素,尤其在数据层次结构复杂的情况下,它允许用户逐级浏览和选择数据。在JavaScript开发中,这种组件能够为用户提供清晰、直观的导航体验,...
在本教程"ajax级联forJava"中,我们将探讨如何使用Ajax、JavaScript以及Java来实现级联下拉框的功能。 级联下拉框常用于需要展示关联数据的场景,如国家和城市的选择,当用户选择一个国家后,下拉框会动态更新并...
然后,你可以编写JavaScript代码来动态生成和更新下拉框。例如,当用户选择“中国”后,程序会读取“中国”的子地区数据并填充下一个下拉框。这里可能涉及递归,因为地区数据可能有多个级别。 以下是一个简单的...