Ajax,Jsp 级联菜单一

最近参照网上的例子,做了个级联菜单。学习一下ajax
参照的列子为:[url=http://www.blogjava.net/ducktsmt/articles/138469.html]JavaDB+JSP+AJAX实现的级联下拉菜单[/url]
他那个为英文的,我改为能处理中文的级联菜单。
[color=olive]我在想能不能在一个页面实现呢?[/color]
新手,请多交流
源码如下:

index.jsp

<%@ page language="java" import="java.util.*,java.sql.*" pageEncoding="gb2312"%>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<head>
<script language="javascript">
var XMLHttpReq;
//创建XMLHttpRequest对象
function createXMLHttpRequest() {
if(window.XMLHttpRequest) { //Mozilla 浏览器
XMLHttpReq = new XMLHttpRequest();
}
else if (window.ActiveXObject) { // IE浏览器
try {
XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
}
//发送请求函数
function sendRequest(url) {
createXMLHttpRequest();
XMLHttpReq.open("GET", url, true);
XMLHttpReq.onreadystatechange = processResponse;//指定响应函数
XMLHttpReq.send(null); // 发送请求
}
// 处理返回信息函数
function processResponse() {
if (XMLHttpReq.readyState == 4) { // 判断对象状态
if (XMLHttpReq.status == 200) { // 信息已经成功返回,开始处理信息
updateMenu();
} else { //页面不正常
alert("您所请求的页面有异常。");
}
}
}
//更新菜单函数
function updateMenu() {
var res=XMLHttpReq.responseXML.getElementsByTagName("res")
/**下面是用innerHTML输出控件内容的一般用法
* var subMenu = "";
* for(var i = 0; i < res.length; i++) {
* subMenu = subMenu + " " + res[i].firstChild.data + "";
* }
* currentSort.innerHTML = subMenu;
**/
var list = document.all.list;
list.options.length=0;
list.add(new Option("---请选择---",""));
for(var i=0;i<res.length;i++){
list.add(new Option(res[i].firstChild.data,res[i].firstChild.data));
}
}
// 创建级联菜单函数
function showSubMenu(obj) {
sendRequest("menu.jsp?sort=" + obj );
/**下面这一句的作用是:每次选择后回到第一个选项**/
// document.all.mli.options[0].selected=true;
}

</script>
</head>
<body>
<select onchange="showSubMenu(this.options[this.options.selectedIndex].value)" name="select1">
//下面由于数据库结构不一样,我直接写上的,也可以从数据库中取出
<option value=''>---请选择---</option>
<option value='古遗址'>古遗址</option>
<option value='古墓葬'>古墓葬</option>
<option value='古建筑'>古建筑</option>
<option value='石窟寺及石刻'>石窟寺及石刻</option>
<option value='近现代重要史迹及代表性建筑'>近现代重要史迹及代表性建筑</option>
</select>
<select name="list" onchange="if(this.selectedIndex)alert('您选择的是:'+this.options[this.options.selectedIndex].value)">
<option name="">---请选择---</option>
</select>
</body>
</html>

menu.jsp:

<%@ page contentType="text/html; charset=GB2312" import="java.util.*,java.sql.*" %>
<%
String sort=new String(request.getParameter("sort").getBytes("iso-8859-1"),"GB2312");
System.out.print("sort="+sort);
String dbDriver = "com.microsoft.jdbc.sqlserver.SQLServerDriver"; //连接sql数据库的方法
String url = "jdbc:microsoft:sqlserver://localhost:1433;DatabaseName=test";
String userName = "数据库用户名";
String password = "数据库密码";
Connection conn = null;
Statement st = null;
ResultSet rs = null;
List lists = new ArrayList();

try{
Class.forName(dbDriver);
} catch(java.lang.ClassNotFoundException e) {
e.printStackTrace();
}

try {
conn = DriverManager.getConnection(url,userName,password);
st=conn.createStatement();
rs=st.executeQuery("SELECT 要选择的字段 FROM 表名 where 条件='"+sort+"'");
while (rs.next())
{
lists.add(rs.getString(1));
}
rs.close();
st.close();
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
response.setContentType("text/xml; charset=gb2312");
response.setHeader("Cache-Control", "no-cache");
//必须要写下面这一行,不然取出的XML长度为0
response.getWriter().write("<?xml version=\"1.0\" encoding=\"gb2312\"?>");
out.println("<response>");
for(int i=0;i<lists.size();i++)
{
out.println("<res>" + lists.get(i).toString() + "</res>");
}
out.println("</response>");
%>
jsp实现级联菜单 jsp实现级联菜单 jsp实现级联菜单jsp实现级联菜单jsp实现级联菜单jsp实现级联菜单jsp实现级联菜单 立即下载

相关推荐

jsp+ajax实现三级级联

通过jsp以及ajax来实现三级级联下拉列表

jquery用ajax实现级联

<br /> <br />1、刚开始页面初始化的时候调用该方法,将在页面显示初始化记录页面如图<br /> <br />//列表初始化方法进入页面后调用 $(document).ready(function(){ $.ajax({ url:'init.action',//请求的URL cache: false, //不从缓存中取数据 data:{pid:2},//发送的参数 type:'Get',//请求类型

zj0715的专栏 531

JSP+AJAX+MYSQL实现二级级联菜单

JSP+AJAX+MYSQL实现二级级联菜单

jsp java ajax二级联动实现

数据库sql:  CREATE TABLE `tb_category` (   `cid` char(40) NOT NULL,   `cname` varchar(50) DEFAULT NULL,   `pid` char(40) DEFAULT NULL,   `desc` varchar(200) DEFAULT NULL,   PRIMARY KEY (`cid`),  

samuBO的博客 6732

别再只盯着GPS了!手把手教你用Python仿真UWB定位,30厘米精度是怎么算出来的?

本文详细解析了UWB(超宽带)室内定位技术的原理与实现,通过Python代码演示如何从三边测量法到实现30厘米精度的定位。文章涵盖了UWB的核心数学模型、Python仿真环境搭建、误差分析及优化策略,为开发者提供了实用的技术指南和应用场景。

weixin_26873711的博客 252

跨时钟域传输数据——单bit和多bit信号(总结)

总结单bit和多bit信号的跨时钟域传输

qq_42135020的博客 1万+

JSP+AJAX三级级联及更多级的实现。

使用网上的一个例子,结合自已的实践,还没有做出来,先放在这里,慢慢的改进~~原来网页的链接没看到了~~ 第一个页面:menu.jsp request.setCharacterEncoding("UTF-8"); response.setContentType("text/html;charset=UTF-8"); %> 级联菜单  //连接到数据库,并且得到一个List,作

dengjianqiang001的专栏 548

3. ChaosBlade-Box平台安装

参考自:https://chaosblade.io/docs/about-chaosblade/box-introduce/通过ChaosBlade-Box可实现chaosblade等已托管工具自动化部署,按照社区的建立的混沌实验模型统一实验场景,根据主机、Kubernetes、应用来划分目标资源,通过目标管理器来控制,在实验创建页面,可以实现白屏化的目标资源选择。

lldhsds的专栏 2485

利用Ajax技术实现级联列表。

当在第一个列表框中输入省名时,在第二个列表框中显示该省包含的城市。

weixin_52360960的博客 343

利用WI生成无线信道数据

选取DeepMIMO的一个射线追踪场景O1(Outdoor 1)Scenario,工作频率为3.5GHz。有两条街和一个十字路口的户外场景18个基站和超过一百万个用户18个基站(BSs):BS1-BS18.每个基站的高度是8米每个基站的天线阵列是isotropic天线三个统一的x-y用户网格用户的总计数量为:1184923每个用户网格中的第一个用户总是(x,y)坐标最低的用户 所有用户的高度是2m每个用户的每个天线阵列是isotropic天线定义射频追踪场景。

bingbingaidaima的博客 5602

OpenBCI脑电数据处理实战:用MNE库从Raw对象到可视化分析全流程

本文提供了使用MNE-Python库处理OpenBCI脑电数据的完整实战指南。从通过BrainFlow库获取原始数据流、创建核心的Raw对象,到进行工频滤波、带通滤波等关键预处理步骤,最后实现时域信号、功率谱密度及地形图等多种专业可视化分析,手把手教你完成脑机接口数据处理的全流程。

gin88的博客 369

多级联动(三级联动)

多级联动 原理 选中顶级分类,查询出顶级分类对应的二级分类至下啦菜单,选择出二级类,查询出二级分类对应的三级分类,这个效果就是多级联动 原始实现思路 1、定义路由 2、查询顶级分类(pid=0) 发送至视图 3、循环展示 4、给顶级分类下拉框绑定内容改变事件(JS:onchange、JQ:change) 5、获取到选中的option的value值(本分类的主键id) 6、根据ID发送ajax请求 7、后端定义新方法 8、接收ajax请求的id值,就是要查询的pid的where 9、

MrWangisgoodboy的博客 3992

STM32cube HAL库两条命令实现i2c通信---Nucleo L476RG用I2C实现tmp117模块温度读取并串口打印

Getting Started with STM32 - I2C Example

m0_54706625的博客 1831

基于ajax+struts实现的二级联动

周末闲来无事,就自己动手写了一个二级联动,主要使用了ajax,后台用struts作为控制器;有了二级联动之后,三级四级自然不在话下。废话少说,直接上源码。源码有点大,放在http://down.51cto.com/data/1470569。,完全免费。。。。前台页面main.jsp:main.jsp<%@ page language="java" import="jav...

weixin_33711641的博客 152

基于STM32L4XX、HAL库的AD7124模数转换器ADC驱动程序设计

/ 检查ID是否正确 (AD7124-4/AD7124-8有不同的ID)// 转换为电压值 (假设使用内部2.5V基准)// 构造读命令: 1(R/W) + 1(0) + 6(寄存器地址)// 构造写命令: 0(R/W) + 1(0) + 6(寄存器地址).config = 0, // 使用配置0。内置可编程增益放大器(PGA):1-128倍。// 读取ADC数据。// 读取当前ADC控制寄存器。// 检查数据是否就绪。// 写回ADC控制寄存器。// 初始化AD7124。

zhusl6688的博客 519

OpenClaw + Antigravity + 飞书完整部署教程

在 Linux 服务器上部署 OpenClaw,使用 Antigravity 本地代理 AI 模型,并接入飞书实现 24 小时在线 AI 助手。

Maynor的博客 1787

ajax的下拉菜单,下拉菜单的级联操作(ajax)

在开发中常常会遇到菜单的级联操作,比如:国家、城市、乡镇的选择等。当选中某个国家的时候,后面的菜单会把该国家内的城市罗列出来,当选中城市的时候,后面的菜单会把对应的乡镇列出来。解决这种菜单的级联操作的办法,我理解的有两种:①使用js来实现,把页面所用到的级联数据放到js内,当页面加载完成后,通过js显示到对应的select内,这种方法的解决办法有很多种,最为直观的一种是放到多维数组中,每个人的思维...

weixin_42489917的博客 925

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

ajax二级联动菜单

最进同学要我做了个二级联动菜单,参考了网上的一些资料,再自己做了些修改,自我感觉做的还可以了啊,呵呵,乱砍了!页面代码如下:%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>    var xmlHttp;  function createXMLHttpRequest(){    if(window.ActiveXObje

xiaolu123456789的专栏 1716

汉书HE8,好用的汇编代码编写工具

汉书HE8,好用的汇编代码编写工具早期编写汇编代码所用功能强大

NTscan扫描工具

ntscan是一个扫描器,可以扫描没有密码和弱密码的共享,先到配置文件中填写猜测的用户名和密码,扫描过程中右侧出现的是扫描日志。

ajax异步请求数据库实现级联下拉菜单。

ajax实现级联下拉菜单,使用Springboot实现。 思路很简单,使用ajax异步请求数据库数据即可。 实现效果: 废话不多说,现在我们来开始实现! 第一步、 创建三张表:省、市、县。 CREATE TABLE `province` ( `id` int(11) NOT NULL AUTO_INCREMENT, `provinceID` int(11) NOT NULL, `province` varchar(20) NOT NULL, PRIMARY KEY (`id`) ) E

weixin_46295656的博客 1286

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

用ajax做级联操作,下拉菜单的级联操作(ajax)

在开发中常常会遇到菜单的级联操作,比如:国家、城市、乡镇的选择等。当选中某个国家的时候,后面的菜单会把该国家内的城市罗列出来,当选中城市的时候,后面的菜单会把对应的乡镇列出来。解决这种菜单的级联操作的办法,我理解的有两种:①使用js来实现,把页面所用到的级联数据放到js内,当页面加载完成后,通过js显示到对应的select内,这种方法的解决办法有很多种,最为直观的一种是放到多维数组中,每个人的思维...

weixin_39768645的博客 935

jsp mysql下拉框联动_JavaDB+JSP+AJAX实现的级联下拉菜单

评论#re: JavaDB+JSP+AJAX实现的级联下拉菜单[未登录]2007-11-25 16:57haohao#re: JavaDB+JSP+AJAX实现的级联下拉菜单2007-11-30 10:41shaomin谢谢分享收下了回复更多评论#re: JavaDB+JSP+AJAX实现的级联下拉菜单2007-12-29 15:57JITATA谢谢,好东西,收藏中。。。回复更多...

weixin_39881387的博客 384

java ajax级联_Ajax实现动态的二级级联菜单

今天花了点时间用Ajax实现了一个二级级联菜单。整理总结一下。为了把重点放在Ajax和级联菜单的实现上,本文省略了数据库建表语句和操作数据库的代码!数据库建表语句就不帖出来了。主要有两张表,区域表:district。街道表:street。区域表和街道表是一对多关系,一个区域可以有零到多个街道,一条街道属于一个区域。数据如下: 页面代码 index.jsp:Insert title h...

weixin_42531494的博客 396

基于Ajax和servlet的二级联动菜单实现

jsp代码 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>二级联动菜单</title> </head> <script type="text/javas

weixin_45956838的博客 299

JavaWeb——使用Ajax实现级联下拉列表

利用 Ajax 技术可以在页面实现一个级联下拉列表。

御承扬的博客 2696

用DB+JSP+AJAX实现级联菜单

最近做的项目中涉及到5,6级的级联菜单,用以前那种纯JavaScript做起来实在是太低效了,页面响应慢得跟286一样。。。于是上网找AJAX实现的级联菜单,找来找去找不到用DB+JSP+AJAX实现的。索性把人家的代码拿来改了改,自己做了一个。 我之所以采用这个代码作为修改的蓝本,是因为这个代码的服务端处理程序返回的是标准的XML序列,客户端的JavaScript通过 var res = X

llwan的专栏 2117

四级联动,级联菜单,Ajax

按照别人的改编的menu.jsp************************************************************************************************************************************request.setCharacterEncoding("gb2312");%> 

yangdeng111的专栏 793
上一篇: ssh(struts2+spring2.0+hibernate3.1)上传下载例子
下一篇: Js,xml 级联菜单(二)
avanry
博客等级 码龄20年 4粉丝 79原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值