lzth
- 浏览: 142327 次
- 性别:
- 来自: 北京
-
最新评论
-
笑傲郝：
JSP中,hidden用法 -
眼镜蛇：
哦，找到了，getComboVc()。开始没细看。不好意思
Swing中可多选下拉框的简单实现 -
眼镜蛇：
朋友不知你还能不能看到，这个组件写得非常好。但我想知道，我应该 ...
Swing中可多选下拉框的简单实现 -
lzth：
--什么是命名查询？
Hibernate允许在映射文件中定义 ...
Hibernate中sql-query return CDATA 用法 -
wuzhiyuzhi：
在这里面写SQL有什么用的呀？为什么要在XML里这样写？
Hibernate中sql-query return CDATA 用法
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>JS联动下拉框</title>
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta name="Originator" content="Microsoft Visual Studio .NET 7.1">
<script language="javascript" >
/*
** ==================================================================================================
** 类名：CLASS_LIANDONG_YAO
** 功能：多级连动菜单
**
** 作者：YAODAYIZI
** ==================================================================================================
**/
function CLASS_LIANDONG_YAO(array)
{
//数组，联动的数据源
this.array=array;
this.indexName='';
this.obj='';
//设置子SELECT
// 参数：当前onchange的SELECT ID，要设置的SELECT ID
this.subSelectChange=function(selectName1,selectName2)
{
//try
//{
var obj1=document.all[selectName1];
var obj2=document.all[selectName2];
var objName=this.toString();
var me=this;
obj1.onchange=function()
{
me.optionChange(this.options[this.selectedIndex].value,obj2.id)
}
}
//设置第一个SELECT
// 参数：indexName指选中项,selectName指select的ID
this.firstSelectChange=function(indexName,selectName)
{
this.obj=document.all[selectName];
this.indexName=indexName;
this.optionChange(this.indexName,this.obj.id)
}
// indexName指选中项,selectName指select的ID
this.optionChange=function (indexName,selectName)
{
var obj1=document.all[selectName];
var me=this;
obj1.length=0;
obj1.options[0]=new Option("请选择",'');
for(var i=0;i<this.array.length;i++)
{
if(this.array[i][1]==indexName)
{
//alert(this.array[i][1]+" "+indexName);
obj1.options[obj1.length]=new Option(this.array[i][2],this.array[i][0]);
}
}
}
}
</script>
</head>
<body>
<form name="form1" method="post">
<SELECT ID="s1" NAME="s1" >
<OPTION selected></OPTION>
</SELECT>
<SELECT ID="s2" NAME="s2" >
<OPTION selected></OPTION>
</SELECT>
<SELECT ID="s3" NAME="s3">
<OPTION selected></OPTION>
</SELECT>
<SELECT ID="x1" NAME="x1" >
<OPTION selected></OPTION>
</SELECT>
<SELECT ID="x2" NAME="x2" >
<OPTION selected></OPTION>
</SELECT>
<SELECT ID="x3" NAME="x3">
<OPTION selected></OPTION>
</SELECT>
<SELECT ID="x4" NAME="x4">
<OPTION selected></OPTION>
</SELECT>
<SELECT ID="x5" NAME="x5">
<OPTION selected></OPTION>
</SELECT>
</form>
</body>
<script language="javascript">
//例子1-------------------------------------------------------------
//数据源
var array=new Array();
array[0]=new Array("华南地区","根目录","华南地区"); //数据格式 ID，父级ID，名称
array[1]=new Array("华北地区","根目录","华北地区");
array[2]=new Array("上海","华南地区","上海");
array[3]=new Array("广东","华南地区","广东");
array[4]=new Array("徐家汇","上海","徐家汇");
array[5]=new Array("普托","上海","普托");
array[6]=new Array("广州","广东","广州");
array[7]=new Array("湛江","广东","湛江");
//--------------------------------------------
//这是调用代码
var liandong=new CLASS_LIANDONG_YAO(array) //设置数据源
liandong.firstSelectChange("根目录","s1"); //设置第一个选择框
liandong.subSelectChange("s1","s2"); //设置子级选择框
liandong.subSelectChange("s2","s3");
//例子2-------------------------------------------------------------
//数据源
var array2=new Array();//数据格式 ID，父级ID，名称
array2[0]=new Array("测试测试","根目录","测试测试");
array2[1]=new Array("华北地区","根目录","华北地区");
array2[2]=new Array("上海","测试测试","上海");
array2[3]=new Array("广东","测试测试","广东");
array2[4]=new Array("徐家汇","上海","徐家汇");
array2[5]=new Array("普托","上海","普托");
array2[6]=new Array("广州","广东","广州");
array2[7]=new Array("湛江","广东","湛江");
array2[8]=new Array("不知道","湛江","不知道");
array2[9]=new Array("5555","湛江","555");
array2[10]=new Array("++++","不知道","++++");
array2[11]=new Array("111","徐家汇","111");
array2[12]=new Array("222","111","222");
array2[13]=new Array("333","222","333");
//--------------------------------------------
//这是调用代码
//设置数据源
var liandong2=new CLASS_LIANDONG_YAO(array2);
//设置第一个选择框
liandong2.firstSelectChange("根目录","x1");
//设置子选择框
liandong2.subSelectChange("x1","x2")
liandong2.subSelectChange("x2","x3")
liandong2.subSelectChange("x3","x4")
liandong2.subSelectChange("x4","x5")
</script>
</html>
分享到：
发表评论
-
java中serializable是什么
2012-04-27 10:02 0一个对象序列化的接口，一个类只有实现了Serializab ... -
Java获取本地IP
2012-04-26 17:36 907import java.net.*; pub ... -
Swing中可多选下拉框的简单实现
2011-07-08 11:00 8569实现可多选下拉框需要写三个类： MyComboBox ... -
我为什么选择 iBatis 而不是 Hibernate(对于正在选型的人的建议)
2011-07-07 15:10 956[注意]清在回复之前认真地看一下我的帖子，结合你的实际项目经验 ... -
选择Hibernate还是iBatis?
2011-07-07 15:05 1025选择Hibernate还是iBATIS都有它的道理： Hi ... -
通过 JAVA SWING 看透 MVC 设计模式[组图]
2011-07-05 12:42 1154一个好的用户界面(GUI) ... -
Swing MVC 结构
2011-07-05 10:03 1644MVC 是 Model-View-Controller 的简称 ... -
JTree放入JSplitPane范例
2011-07-02 14:58 1190范例1 import javax.swing.JFrame; ... -
STRUTS的struts--config.xml详解
2011-06-16 15:42 193301.<?xml version="1.0&q ... -
Proxool连接池实现
2011-06-16 11:13 960首先从 http://proxool.sourceforg ... -
<c:out value="${}"/>|JSTL标签|标签库和EL
2011-04-28 17:15 1305这是JSTL标签的用法 JST ... -
Spring MVC 入门
2011-04-15 14:07 846这篇文章将教你快速地上手使用 Spring 框架. 如果你 ... -
DispatcherServlet定义档
2011-04-15 10:11 1242DispatcherServlet预设使用servle ... -
JavaMail发送
2011-03-31 17:37 738public boolean sendMailWithPic( ... -
Velocity用法
2011-03-31 15:38 14261、"#"用来标识Velocity的脚本语 ... -
学习Spring之九：AOP in Spring
2011-03-15 22:27 822Spring IoC和 Spring AOP组合，一起形成了S ... -
web缓存服务器
2011-01-28 11:25 1275什么是web缓存服务器 无论企业有多大，Web缓存都有助于优 ... -
JEECMS3.0.2资料
2011-01-28 09:17 905http://jeecms.iteye.com/blog/85 ... -
PDFTable表格生成PDF
2010-06-02 09:28 2733package com.xishui.action; ... -
itext学习之表格pdftable (转载)
2010-06-02 09:26 1562一个最基本的PdfPTable的例子 package ...
相关推荐
本文实例讲述了javascript实现多级联动下拉菜单的方法。分享给大家供大家参考。具体实现方法如下： 代码如下: [removed] <!– Begin var arrItems1 = new Array(); var arrItemsGrp1 = new Array(); arrItems1[3...
### JavaScript 多级联动 Select 实现详解 在前端开发中，多级联动 Select 是一个常见的需求，尤其是在处理地区选择、分类导航等场景时。本文将深入解析如何利用原生 JavaScript 实现多级联动 Select，包括其核心...
JavaScript 自定义多级联动下拉菜单
总结，创建JavaScript自定义多级联动浮动菜单涉及到以下几个关键步骤： 1. 获取和操作DOM元素。 2. 添加事件监听器，响应用户交互。 3. 修改CSS样式以实现显示、隐藏和浮动效果。 4. 维护数据结构，实现菜单的联动。...
在.NET框架中，`ICallbackEventHandler`接口是一个用于实现页面间无刷新通信的重要工具，尤其在构建复杂的Web应用程序时，如多级联动下拉菜单。这种功能可以提高用户体验，因为用户无需等待整个页面重新加载就能看到...
JavaScript（简称JS）是一种轻量级的解释型编程语言，广泛应用于网页和网络应用开发，实现客户端的...通过学习和理解这些知识点，你将能够创建自己的JavaScript多级联动浮动菜单，为网站或应用增加互动性和用户体验。
在本话题中，我们将探讨如何利用JSON来实现多级联动的效果，这是一种常见的前端交互功能，例如在选择省份后自动更新城市选项，或者在选择类别后显示子类别的选项。 多级联动通常涉及到多个下拉框或列表，它们之间...
总结一下，"三级联动 多级联动 JavaScript"是Web开发中的常见功能，它利用JavaScript的事件驱动和DOM操作来实现动态交互。"多级菜单联动.jsp"文件可能是实现这一功能的一个实例，通过解析和理解这个文件，开发者可以...
如果我们要实现多级联动，可以扩展此代码，添加更多的事件监听和条件判断。例如，当选择二级菜单时，可以展示对应的三级菜单： ```javascript $(document).ready(function() { $('#menu > li').click(function() {...
1. JavaScript：作为前端开发的基础语言，JavaScript常用于实现多级联动的逻辑。通过监听事件，改变DOM元素的状态，从而更新关联的选择项。 2. jQuery：一个广泛使用的JavaScript库，简化了DOM操作和事件处理，使得...
总结来说，实现自定义的多级联动下拉菜单涉及HTML布局、JavaScript交互和DOM操作。通过合理地组合这些技术，我们可以创建出功能强大且用户体验优秀的下拉菜单，这在很多Web应用中都是不可或缺的一部分。记得实践是...
### 使用Ajax+JSON实现多级联动菜单的知识点详解 #### 一、背景介绍与概念解析 随着互联网技术的发展，用户对交互式应用的需求日益增长。RIA（Rich Internet Applications）概念的提出更是加速了这一趋势。其中，...
本项目以“多级联动菜单”为主题，结合了HTML的`div`元素、CSS样式以及JavaScript编程，来实现动态交互效果。下面将详细介绍这个主题中的相关知识点。 一、`div`元素 `div`（division）是HTML中最基本的布局容器，...
总的来说，理解和实现JavaScript多级联动浮动菜单是一个涉及前端基础技术、交互设计和用户体验的综合练习。通过研究和实践，开发者不仅能提升JavaScript技能，还能更好地理解网页动态效果的实现原理。
在JavaScript编程中，"js ...总的来说，实现js select多级联动涉及HTML、CSS和JavaScript的综合运用，特别是对DOM操作和事件处理的理解。理解这些知识点并灵活应用，可以创建出高效、用户体验良好的多级联动选择功能。
在JavaScript开发中，多级联动多选checkbox插件是一种常见的交互元素，用于实现层次结构数据的筛选和选择。这类插件通常用在如地区选择、类别分类等场景，用户可以通过逐级选择来过滤出需要的结果。`cascadebox-...
【Ajax多级联动菜单】是一种常见的前端交互设计，它允许用户在选择某个菜单项时，自动更新下一级菜单的内容，以此类推，实现多级菜单之间的动态关联。这种技术广泛应用于网页表单填写、筛选器等场景，为用户提供更加...
JavaScript多级联动浮动菜单 第二版，包含仿京东商城商品分类菜单、仿window xp右键菜单、仿淘宝拼音索引菜单，上一个版本基本实现了多级联动和浮动菜单的功能，但效果不是太好，使用麻烦还有些bug，实用性不高。...
在提供的文件列表中，`selectArea.html`很可能是实现这个多级联动选择器的HTML页面，它包含了相关的HTML结构和可能的JavaScript绑定事件。HTML文件通常会包含若干个`<select>`元素，每个`<select>`代表一个级别的...