首页新闻资讯软件应用操作系统网络编程网页制作站长之家图形图象软件教学冲浪宝典网络安全认证考试服务器技术组网技术

用JSP+JavaScript打造二级级联下拉菜单

2008-02-16 10:35:42 作者

JSP+JavaScript打造二级级联下拉菜单

class(一级栏目信息）classId(自动编号），className（栏目名称）, Nclass（二级栏目信息）, NclassId（自动编号），NclassName(栏目名称），parentId（一级栏目id，与class表中的classId关联）

%26lt;%@ page contentType=text/html; charset=GB2312 language=java errorPage=../error.jsp %%26gt;
%26lt;%@ include file=../conn.jsp%%26gt;
%26lt;%@ include file=../ds.jsp%%26gt;
%26lt;%@ taglib uri=http://java.sun.com/jsp/jstl/sql divfix=sql %%26gt;
%26lt;%request.setCharacterEncoding(gb2312); %%26gt;
%26lt;HTML%26gt;%26lt;HEAD%26gt;
%26lt;META http-equiv=Content-Type content=text/html; charset=gb2312%26gt;

%26lt;TITLE%26gt;级联菜单%26lt;/TITLE%26gt;
%26lt;LINK rel=stylesheet type=text/css href=style.css%26gt;
%26lt;/HEAD%26gt;
%26lt;!--从数据库中得到二级栏目信息--%26gt;
%26lt;%String sql=select * from Nclass order by NclassId asc;
ResultSet rs=stmt.executeQuery(sql);
%%26gt;
%26lt;!--将二级栏目信息保存到数组subcat中--%26gt;
%26lt;script type=text/javascript%26gt;
var onecount;
onecount=0;
subcat = new Array();
%26lt;%
int count = 0;
while(rs.next()){
%%26gt;
subcat[%26lt;%=count%%26gt;] = new Array(%26lt;%=rs.getString(NclassName)%%26gt;,
%26lt;%=rs.getString(NclassId)%%26gt;,%26lt;%=rs.getString(parentId)%%26gt;);
%26lt;%
count++;
}
rs.close();
%%26gt;
onecount=%26lt;%=count%%26gt;;
%26lt;!--决定select显示的函数--%26gt;
function changelocation(locationid)
{
document.myform.NclassId.length = 0;

var locationid=locationid;
var i;
for (i=0;i %26lt; onecount; i++)
{
if (subcat[i][2] == locationid)
{
document.myform.NclassId.options[document.myform.NclassId.length] = new
Option(subcat[i][0], subcat[i][1]);
}
}

}
%26lt;/script%26gt;

%26lt;FORM method=POST name=myform action=adminsave.jsp?action=add%26gt;
%26lt;TABLE%26gt;

%26lt;TR%26gt;
%26lt;TD%26gt;一级分类%26lt;/TD%26gt;
%26lt;TD%26gt;
%26lt;SELECT name=classId onChange=changelocation(document.myform.classId.options
[document.myform.classId.selectedIndex].value) size=1%26gt;
%26lt;OPTION selected value%26gt;==请选一级分类==%26lt;/OPTION%26gt;
%26lt;sql:query var=query dataSource=$%26gt;
select * FROM class
%26lt;/sql:query%26gt;
%26lt;c:forEach var=row items=$%26gt;
%26lt;option value=$%26gt;$%26lt;/option%26gt;
%26lt;/c:forEach%26gt;
%26lt;/select%26gt;
%26lt;/TD%26gt;
%26lt;TD%26gt;选择二级分类%26lt;/TD%26gt;
%26lt;TD%26gt;
%26lt;SELECT name=NclassId%26gt;
%26lt;OPTION selected value%26gt;==请选二级分类==%26lt;/OPTION%26gt;
%26lt;/SELECT%26gt;
%26lt;/TD%26gt;
%26lt;/TR%26gt;
%26lt;/TABLE%26gt;

%26lt;/FORM%26gt;
%26lt;/BODY%26gt;
%26lt;/HTML%26gt;
%26lt;%@ page contentType=text/html; charset=GB2312 language=java errorPage=../error.jsp %%26gt;
%26lt;%@ include file=../conn.jsp%%26gt;
%26lt;%@ include file=../ds.jsp%%26gt;
%26lt;%@ taglib uri=http://java.sun.com/jsp/jstl/sql divfix=sql %%26gt;
%26lt;%request.setCharacterEncoding(gb2312); %%26gt;
%26lt;HTML%26gt;%26lt;HEAD%26gt;
%26lt;META http-equiv=Content-Type content=text/html; charset=gb2312%26gt;