一、设计思路
1. 首先做好课程表静态页面(可用Sublime，Dreawvear等开发工具编写，本人用Sublime编写，代码稍后附上)
2. 数据库设计(可用access数据库、sql数据库或者mysql数据库，根据自己习惯选用数据库，本人选用access数据库。注意：连接不同数据库需要不同数据库驱动，自行百度下载)
课程表效果图
二、课程表实现功能
1.实现select下拉列表的二级联动；
(何为select二级联动:当我在第一个下拉列表选中一个固定的选项之后，第二个下拉列表自动填充相对应选项)
2.实现不同院/系部、不同专业、不同学期的课程表查询
3.读取数据库信息时，使得数据库为null的信息显示在页面上为空字符；
三、实现过程
一.设计界面（附上静态页面代码，页面可根据自己喜好设计）
二.实现select下拉列表的二级联动
附完整代码
步骤解析：
1. 将两个select分别命名为select1和select2，并且分别定义其id为s1和s2，value为s1和s2，同时定义一个函数，代码如下：
<selectname="select1" id="s1" onChange="move()" value=" s1">
<!-- 根据id获取value，onchange（）触发函数move（）修改二级select的text值实现联动 -->
<option value="DZ" selected value="s1">电子信息学院</option>
<option value="JD">机电工程学院</option>
<option value="CJ">财经管理学院</option>
<option value="GS">工商管理学院</option>
</select>
<select name="select2" id="s2" value="s2" >
<!--默认选中，动态生成option -->
<option value="j1"selected>16计算机1班</option>
<option value="j2" >16计算机2班</option>
</select>
2. 编写move函数(代码附有解释)
function move(){
vars1=document.getElementById("s1");
vars2=document.getElementById("s2");
/* <!-- 获取一级和二级的属性--> */
var add;
if(s1.value=="DZ"){
add=new Array("16计算机1班","16计算机2班");//new 来创建数组对象。该代码定义了一个名为 Array 的数组对象，用来存储变量
/* <!--比对value值，实现对应二级text值的动态生成-->*/
}else if(s1.value=="JD"){
add=new Array("16机器设计与制造1班","16机器设计与制造2班");
}else if(s1.value=="CJ"){
add=new Array("16财务管理1班","16财务管理2班");
}else if(s1.value=="GS"){
add=new Array("16物流管理1班","16物流管理2班");
}else if(s1.value=="s1") {
add=new Array("16计算机1班","16计算机2班");
}else{
add=null; /*<!--若没有就为空，当然不可能出现的-->*/
}
s2.length=0;
for(var i=0;i<add.length;i++){
var ss=new Option();
ss.text=add[i].split()[0];
s2.add(ss); /* <!--把text值添加到二级select中，显示出来-->*/
}
}
三、 实现不同院/系部、不同专业、不同学期的课程表查询
步骤解析：
1. 在web项目中新建一个schedule1.jsp的页面，将做好的静态页面粘贴到schedule1.jsp中，运行；
2. 设计数据库（本人用access数据库，数据类型除了id为自动编号其余全部为文本，课程信息则自己根据实际加入即可，详情看附图）
3. 连接access数据库实现查询功能，代码如下（前提：数据库驱动已经部署完毕）
提醒：通过if..else if..else进行判断，为了方便，在这里我只判断是否是电子信息学院的，不是的话直接查询schedule1数据库中的6条数据（top 6指的是只查询6条数据 ；where id>XX是指从第XX+1条数据开始读取；order by id asc按照id进行升序处理）
1.该段代码放在body下面即可：
<%
StringodbcQuery;
%>
<%
request.setCharacterEncoding("utf-8");
Stringquery_type=request.getParameter("select1"); //通过request.getParameter分别获取select1、2、3的数值
Stringquery_type1=request.getParameter("select2");
Stringquery_type2=request.getParameter("select3");
if(query_type1!=null&&query_type!=null){
if(query_type.equals("DZ")) {//判断是否是电子信息学院
if(query_type1.equals("j1")) {//判断是否是16级计算机1班
if(query_type2.equals("di1")) {//判断是否是第一学期
odbcQuery="select top 6 * from schedule1 where id>12 order by id asc";
}
else{
odbcQuery="select top 6 * from schedule1 where id>18 order by id asc";
}
}
else{//16级计算机2班
if(query_type2.equals("di1")){
odbcQuery="select top 6 * from schedule ";
}
else{
odbcQuery="select top 6 * from schedule1 where id>6 order by id asc";
}
}
}
else{
odbcQuery="select * from schedule1";
}
}
else
odbcQuery="selecttop 6 * from schedule1 where id>12 order by id asc";
try{
Class.forName("com.hxtt.sql.access.AccessDriver");
}
catch(ClassNotFoundExceptione){}
ResultSetrs; //建立ResultSet(结果集)对象
try {
String path="jdbc:Access:///"+getServletContext().getRealPath("/").replaceAll("\\\\", "/")+"jiaoyu.mdb";
Connection con = DriverManager.getConnection(path);
Statement sql=con.createStatement();
rs = sql.executeQuery(odbcQuery); //执行SQL语句
%>
2.在两个tr表格之间放进以下代码
<%
while(rs.next()){
%>
3.在</table>之前放进以下代码
<%
}
con.close();
}
catch(SQLException e1){}
%>
四．读取数据库信息时，如何使得数据库为null的信息显示在页面上为空字符
如果用<%=rs.getString("Monday")%>来读取数据库的信息，课程显示情况如下图：
效果图
解决方法：
使用<%=(rs.getString("Monday")==null?"":rs.getString("Monday"))%>该语句来读取数据库，通过加入判断，如果等于null成立，则输出空字符串，否则输出数据库的数据（效果图如下）
效果图