一、在数据库数据库中建立三个表
1.city
字段：
districtname，locationid，districtid
2.province
字段：
locationid，locationname
3.village
字段：
villageid,villagename,districtid
二、代码如下：
<%@ page language="java" contentType="text/html; charset=gb2312"
pageEncoding="gb2312"%>
<%@ page import="java.sql.* "%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>jsp实现三级联动的下拉列表框效果</title>
<%
Connection conn=null;
Statement stmt=null;
ResultSet rs=null,rs1=null,rs2=null;
String sql;
int count;
int count2;
String drivername="com.microsoft.jdbc.sqlserver.SQLServerDriver";
String url="jdbc:microsoft:sqlserver://localhost:1433;DatabaseName=SJLD";
try{
Class.forName(drivername);
conn=DriverManager.getConnection(url,"sa","");
stmt=conn.createStatement（）;
sql="select * from city order by locationid asc";
rs=stmt.executeQuery(sql);
}catch(SQLException e){
System.out.println(e.getMessage());
}
%>
<script language="javascript">
var onecount;
onecount=0;
subcat=new Array();
<%
count=0;
while(rs.next()){
%>
subcat[<%=count%>]=new Array("<%=rs.getString("districtname")%>","<%=rs.getInt("locationid")%>","<%=rs.getInt("districtid")%>");
<%
count = count + 1 ;
}
rs.close();
rs=null;
%>
onecount=<%=count%>;
function changelocation(locationid){
document.myform.smalllocation.length=0;
var locationid=locationid;
var i;
document.myform.smalllocation.options[0]=new Option('==所选城市的地区==','');
for(i=0;i<onecount;i++){
if (subcat[i][1] == locationid)
{
document.myform.smalllocation.options[document.myform.smalllocation.length] = new Option(subcat[i][0], subcat[i][2]);
}
}
}
</script>
<%
sql="select * from village order by districtid asc";
rs2=stmt.executeQuery(sql);
%>
<script language="javascript">
var onecount2;
onecount2=0;
subcat2=new Array();
<%
count2=0;
while(rs2.next()){
%>
subcat2[<%=count2%>]=new Array("<%=rs2.getString("villagename")%>","<%=rs2.getInt("districtid")%>","<%=rs2.getInt("villageid")%>");
<%
count2 = count2 + 1 ;
}
rs2.close();
rs2=null;
%>
onecount2=<%=count2%>;
function changelocation2(districtid)
{
document.myform.village.length = 0;
var districtid=districtid;
var j;
document.myform.village.options[0] = new Option('==所选地区的县区==','');
for (j=0;j < onecount2; j++)
{
if (subcat2[j][1] == districtid)
{
document.myform.village.options[document.myform.village.length] = new Option(subcat2[j][0], subcat2[j][2]);
}
}
}
</script>
</head>
<body>
<form name="myform" method="post">
分类：<select name="biglocation" onChange="changelocation(document.myform.biglocation.options[document.myform.biglocation.selectedIndex].value)" size="1">
<option selected>请选择你所在的省份</option>
<%
sql ="select * from province order by locationname asc";
rs1 = stmt.executeQuery(sql);
while(rs1.next()){
%>
<option value="<%=rs1.getInt("locationid")%>"><%=rs1.getString("locationname")%></option>
<% }
rs1.close();
rs1 = null;
conn.close();
conn =null;
%>
</select><select name="smalllocation" onChange="changelocation2(document.myform.smalllocation.options[document.myform.smalllocation.selectedIndex].value)">
<option selected value="">==所有地区==</option>
</select><select name="village" size="1">
<option selected>==所有县区==</option>
</select>
</form>
</body>
</html>
分享到：
相关推荐
jsp实现三级联动的下拉列表框
综上所述，js+jsp实现的联动下拉列表框是Web开发中常用的功能之一，它能够极大地提升用户的交互体验，并简化开发者的工作量。通过对上述代码的理解和实践，我们可以更好地掌握这种联动机制的实现方式。
在IT行业中，"js+jsp三级联动 源码"是一个常见的前端与后端交互的实践案例，主要用于实现用户界面的动态筛选和过滤。这里，我们主要探讨的是使用JavaScript（js）和JavaServer Pages（jsp）来创建一个具有三级联动...
在Java服务器页面（JSP）开发中，"中国省市三级联动"是一种常见的功能，用于创建交互式的下拉菜单，用户可以选择国家、省份和城市，这三个级别之间存在联动关系。这种功能在很多网站的地址填写或者区域选择场景中...
1、支持PC端级联下拉查询，支持自定义级别，可自由切换层级 2、支持移动端级联下拉查询，支持自定义级别，可自由切换层级 ...5、三级多选树元件（中继器维护数据） 6、四级多选树元件（中继器维护数据）
本示例主要展示了如何使用纯JSP和Direct Web Remoting (DWR)技术来构建一个功能丰富的用户界面，其中包括三级联动下拉选择菜单、无刷新联动、用户存在性判断以及模拟Google搜索效果的功能。DWR是一种JavaScript库，...
### Ajax 实现二级联动下拉列表框 #### 一、简介 在Web开发中，有时我们需要根据用户在第一个下拉列表中的选择动态地更新第二个下拉列表的内容。这种功能被称为“二级联动”，常用于地址选择（如省份和城市的选择）...
本文将介绍如何使用 JSP 和 Java 实现选择框多级连动，并解决城市地址选择连动的问题。 首先，需要建立两个数据表：articleClass 和 articleSubClass。articleClass 表用于存储文章分类信息，包括文章分类 ID、名称...
本文将探讨如何利用Java Server Pages (JSP) 和 jQuery 实现省市区三级联动的效果，同时结合SQL数据库提供数据支持。 首先，JSP是Java平台上的服务器端脚本语言，它允许开发者在HTML代码中嵌入Java代码，以实现动态...
三级联动是指三个下拉列表框之间存在依赖关系，即选择一个列表框中的项，其他列表框的内容会根据所选项动态加载。在这个案例中，省份选择会影响到城市列表，城市选择又影响到县（区）列表。实现这种功能通常需要...
在IT行业中，"jsp-ajax的三级联动(省市区mysql数据库表)"是一个常见的前端与后端交互的示例，主要用于实现动态下拉菜单的选择效果。在这个项目中，我们可以通过选择省份来自动更新城市列表，进一步选择城市后，区县...
在本项目中，我们将探讨如何利用JSP（JavaServer Pages）技术实现省市区的三级联动，并结合数据库进行数据交互。 首先，我们要理解JSP的基础。JSP是一种动态网页技术，它允许开发者将HTML、CSS、JavaScript与Java...
在Java开发中，三级联动通常指的是在用户界面中，三个下拉列表框（dropdown lists）之间存在关联性，即选择其中一个下拉框的选项会动态更新其他下拉框的内容。这种功能在地域选择、分类导航等场景中非常常见。在给定...
**三级联动** 是指在Web表单中，三个下拉列表框之间存在的联动关系。例如，在选择省之后，市下拉框会根据省的选择动态加载对应的数据；接着选择市后，区/县下拉框也会相应地更新。这种功能常用于地址选择、商品分类...
【标题】"三级联动数据库应用实例"涉及到的是在Web开发中的一个常见功能，即通过Ajax技术、DWR（Direct Web Remoting）框架以及数据库交互实现的三级联动效果。这种效果通常用于下拉菜单或者选择框，当用户在一级...
在实现三级联动菜单时，开发者通常会使用JavaScript、Java以及JSP（JavaServer Pages）等技术。下面将详细介绍这些技术在创建三级联动菜单中的应用。 1. **JavaScript**：作为客户端脚本语言，JavaScript主要负责...
总结来说，这个项目展示了如何整合Struts2、Hibernate和Spring三大框架，实现一个动态的二级联动下拉列表功能。它涉及了后端数据库操作、MVC架构的运用、前端AJAX请求以及响应处理等多个关键知识点。对于学习和理解...
在IT行业中，"三级联动"通常指的是在一个应用中，三个或更多下拉列表框之间存在联动关系，即一个下拉框的选择会影响到下一个下拉框的数据加载。这种技术常见于地域选择、产品分类等场景，提供了良好的用户体验。在这...
总的来说，这个实例展示了如何利用jQuery的事件监听和Ajax异步通信，配合jsp和Servlet处理服务器端逻辑，以及MySQL数据库存储和检索数据，来实现动态更新的省市县三级联动效果。通过这种方式，可以提供用户友好的...
本项目"struts2+hibernate+spring实现的二级联动下拉列表"展示了如何将这三个框架整合起来，实现一个功能：在用户界面上展示两个下拉列表，当用户选择第一个下拉框的值时，第二个下拉框的内容会根据所选值动态更新。...