繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 下拉框联动
- Javascript
- jquery 交替为表格添加样式的代码
- jquery下操作HTML控件的实现代码
- JQuery获取元素文档大小、偏移和位置和滚动条位置的方法集合
- 海量经典的jQuery插件集合
- JavaScript获取鼠标坐标的函数（兼容IE、FireFox、Chrome）
- JavaScript关于select的相关操作说明
- jQuery的一些特性和用法整理小结
- 用jQuery扩展自写的 UI导航
- JQuery 引发两次$(document.ready)事件
- javascript实现的基于金山词霸网络翻译的代码
- Span元素的width属性无效果原因及解决方案
- javascript 不间断的图片滚动并可点击
- 利用onresize使得div可以随着屏幕大小而自适应的代码
- extjs 为某个事件设置拦截器
- javascript 构建一个xmlhttp对象池合理创建和使用xmlhttp对象
- javascript 特性检测并非浏览器检测
- 20个非常有用的PHP类库 加速php开发
- 前淘宝前端开发工程师阿当的PPT中有JS技术理念问题
- AJAX的跨域与JSONP(为文章自动添加短址的功能)
- JavaScript学习笔记（十）
Javascript 中的 下拉框联动
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-08-10 浏览: 79 ::
收藏到网摘: n/a
下拉框联动有两个java类，两个jsp页面，和一个js组成。
MultiSelect.java
该类用于生成实现联动需要的Array数组
package select;
import java.util.*;
import java.sql.*;
import java.io.*;
public class MultiSelect {
/**
*产生JavaScript中用于联动的array代码
*以省市为例
*一般为了javascript程序的方便,建议输出格式为:
*subcat1[subcat1.length] = new Array("江阴","12.10","12");
*其中"江阴"的值为"12.10","12"对应江苏省,越大的范围的值越往后
*subcat1[subcat1.length] = new Array("常州","12.11","12");
**/
public static String getArray(String name, String sql) throws java.sql.SQLException {
Connection conn=null;
try {
Class.forName("com.microsoft.jdbc.sqlserver.SQLServerDriver");
conn =
DriverManager.getConnection("jdbc:microsoft:sqlserver://localhost:1433;DatabaseName=test",
"test", "test");
} catch (java.lang.ClassNotFoundException e) {
System.err.print("ClassNotFoundException: " + e.getMessage());
}
Statement stmt = conn.createStatement();
ResultSet rs=stmt.executeQuery(sql);
StringBuffer sb = new StringBuffer();
while(rs.next()){
sb.append(name + "[" + name + ".length] = new Array(" +
getString(rs.getString(0),rs.getString(1),rs.getString(2)) + ");\n");
}
return sb.toString();
}
private static String getString(String s1,String s2,String s3) {
String temp = "\"" + s1 + "\",\""+s2+"\",\""+s3+"\"";
return temp;
}
}
--------------------------------------------------------------------------------
SelectJS 该类主要是用来生成sql语句。
package select;
public class SelectJS {
/**
* 写出sql，调用
* @param name 数组名称
* @return
* @throws java.sql.SQLException
*/
public static String getProducts(String name) throws java.sql.SQLException {
return MultiSelect.getArray(name,
"select describe,code,fcode from testone "
);
}
}
---------------------------------------------------------------------------------
citys.jsp主要是用来得到Array数组
<%@ page contentType="text/html;charset=GB2312" %>
<%@ page import="select.*"%>
var citys = new Array();
<%=SelectJs.getDealerCity("citys")%>
-----------------------------------------------------------------------------------
select.js 主要是用来显示下拉框中的数据
function clearselect(Aa){
clearList(Aa);
Aa.options[Aa.length] = new Option("没有回答", "");
}
//use "" to clear all:(值的索引为1)
//Aa为被联动的select,
//locationid为主联动值,
//arr为用于生成的Array,
//index1为Array中用于比较主联动值的索引
function changelocation1(Aa,locationid,arr,index1){
clearselect(Aa);
var i;
for (i=0;i < arr.length; i++){
if (arr[i][index1] == locationid ){
Aa.options[Aa.length] = new Option(arr[i][0], arr[i][1]);
}
}
}
//from chinaquest
function clearList(ctrl){
if (document.all) {
for(;ctrl.options.length>0;)
ctrl.options.remove(ctrl.options.length-1);
}else{
for(;ctrl.options.length>0;)
ctrl.options[ctrl.options.length-1] = null;
}
}
-------------------------------------------------------------------------------------
selecttest.jsp 进行页面使用
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<script language="JavaScript" src="citys.jsp"></script>
<script language="JavaScript" src="select.js"></script>
<body>
<form method="post">
<select name="sel_brand"
onchange="changelocation1(this.form.elements['sel_city'],this.value,citys,2);">
<%
String sql="select code,Describe from testone ";
ResultSet rs=stmt.executeQuery(sql);
while(rs.next()) {
%>
<option value="<%=rs.getString(0)%>"><%=rs.getString(1)%></option>
<% } %>
</select>
<select name="sel_city">
<option value="">没有回答</option>
</select>
</form>
</body>
</html>
评论 (0) All
