You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
text1/web/WEB-INF/student/sIndex.jsp

170 lines
15 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!-- 上述两行是JSP页面相关的指令
第一行用于设置此JSP页面的内容类型为text/html即HTML格式页面指定字符编码为UTF-8同时表明该页面使用Java语言来处理页面中的相关逻辑。
第二行引入了JSTLJavaServer Pages Standard Tag Library的核心标签库给其定义的前缀是"c"后续就能通过这个前缀来使用JSTL提供的各类标签例如用于循环遍历、条件判断等操作的标签便于在JSP页面中灵活处理动态数据 -->
<html>
<head>
<title>${html_title}</title>
<!-- 设置当前HTML页面的标题这里使用了EL表达式${html_title}),意味着标题的值是动态从后台传递过来的某个变量所对应的值,而不是固定的文本 -->
<script>
//JavaScript代码区域
layui.use('element', function(){
var element = layui.element;
element.init();
// 使用layui框架的element模块调用其init方法进行初始化操作。在layui框架中element模块提供了很多页面元素交互相关的功能例如实现页面布局的动态切换、菜单的展开收起等交互效果通过调用init方法可以激活这些功能确保页面上基于element模块构建的各种UI组件能够正常工作
});
</script>
<style>
.layui-card.layui-card-body.layui-icon {
display: inline-block;
width: 100%;
height: 60px;
line-height: 60px;
text-align: center;
border-radius: 2px;
font-size: 30px;
background-color: #F8F8F8;
color: #333;
transition: all.3s;
-webkit-transition: all.3s;
/* 以下是针对类名为"layui-card.layui-card-body.layui-icon"的元素设置的样式规则:
将其设置为行内块元素display: inline-block使其能在水平方向排列且可以设置宽高
宽度占满父元素的100%高度设置为60px
通过line-height属性让内部文本垂直居中
文本水平居中text-align: center
设置圆角半径为2px使其边角更圆润
字体大小为30px
背景颜色为浅灰色(#F8F8F8文本颜色为深灰色#333
定义了CSS过渡效果transition当元素的样式属性发生变化时会在0.3秒内平滑过渡,同时添加了-webkit-前缀是为了兼容webkit内核的浏览器如Chrome、Safari等 */
}
.layui-card.layui-card-body {
text-align: center;
/* 针对类名为"layui-card.layui-card-body"的元素设置文本水平居中样式,影响其内部包含的子元素的文本对齐方式 */
}
#notify {
text-align: left;
/* 针对id为"notify"的元素设置文本左对齐样式,覆盖可能存在的其他文本对齐规则,使其内部文本靠左显示 */
}
</style>
</head>
<body class="layui-layout-body" style="background-color: #F2F2F2">
<!-- 为页面主体body设置了类名"layui-layout-body",同时将背景颜色设定为浅灰色(颜色值为#F2F2F2这里的类名大概率与layui框架的布局样式相关联按照其框架规范来构建页面的整体外观 -->
<jsp:include page="/filterLogin.jsp"></jsp:include>
<!-- 通过JSP的include指令包含名为filterLogin.jsp的页面内容通常这个页面用于处理用户登录相关的验证逻辑或者展示登录相关的界面元素比如登录表单等以此确保只有登录后的用户才能访问后续页面内容 -->
<jsp:include page="/WEB-INF/student/sHeader.jsp"></jsp:include>
<!-- 包含位于WEB-INF/student目录下的sHeader.jsp页面该页面一般用于构建页面的头部区域可能包含如网站logo、导航栏等常见的头部元素起到统一页面头部布局的作用 -->
<jsp:include page="/WEB-INF/student/studentNav.jsp"></jsp:include>
<!-- 再次使用JSP的include指令包含了WEB-INF/student目录下的studentNav.jsp页面这个页面大概率是用来展示学生端特有的导航菜单内容方便用户在不同功能模块之间进行切换操作 -->
<div class="layui-layout layui-layout-admin">
<!-- 创建一个div元素并赋予其两个类名"layui-layout"和"layui-layout-admin"这通常是layui框架中用于定义页面整体布局结构的特定类名遵循layui框架的布局规范来划分页面的不同区域 -->
<div class="layui-body">
<!-- 在上述布局div内部再创建一个div元素类名为"layui-body"在layui框架里这个区域一般是用于承载页面主要内容的部分例如展示各种业务数据、操作按钮等内容 -->
<!-- 内容主体区域 -->
<div style="padding: 15px;">
<!-- 新建一个div元素并通过内联样式设置其四周内边距为15px这样做主要是为了对内部元素进行一定的排版让页面内容看起来更加规整避免显得过于紧凑或者松散 -->
<div class="layui-card">
<!-- 创建一个layui框架的卡片card组件layui的卡片组件常用于对相关内容进行分组展示使其在页面上有比较清晰的视觉划分 -->
<div class="layui-card-header" id="index-function">功能</div>
<!-- 创建一个用于显示卡片头部的div元素设置了id为"index-function",显示文本为"功能"通常用于给卡片添加标题说明在layui框架里会按照其样式规则展示比如有特定的背景色、字体样式等 -->
<div class="layui-card-body">
<!-- 创建一个用于显示卡片主体内容的div元素在layui框架中这个区域就是放置具体内容的地方 -->
<ul class="layui-row layui-col-space10 layui-this">
<!-- 创建一个无序列表ul元素应用了"layui-row"、"layui-col-space10"和"layui-this"类名:
"layui-row"表示该列表按照layui框架的布局规则以行的形式进行排列
"layui-col-space10"用于设置列表项之间的水平间距为10px
"layui-this"可能是用于标记当前元素处于某种特定状态比如选中状态等具体依赖layui框架的样式设定 -->
<li class="layui-col-xs3">
<!-- 创建一个列表项li元素应用"layui-col-xs3"类名表示该元素在小屏幕xs一般指手机等小尺寸设备下占父元素宽度的1/4基于layui的响应式布局规则 -->
<a href="${pageContext.request.contextPath}/studentSelectCourseListServlet">
<!-- 创建一个超链接a标签链接地址指向名为"studentSelectCourseListServlet"的Servlet通过EL表达式动态获取上下文路径拼接而成点击该链接会跳转到对应的功能页面用于实现相关业务操作 -->
<i class="layui-icon layui-icon-survey"></i>
<!-- 创建一个图标元素i标签应用了layui框架的图标类layui-icon layui-icon-survey表示一个特定的图标样式用于直观展示相关功能 -->
<cite>选课与成绩</cite>
<!-- 使用<cite>标签显示文本"选课与成绩",用于对链接对应的功能进行文字说明 -->
</a>
</li>
<li class="layui-col-xs3">
<a href="${pageContext.request.contextPath}/studentOptionalCourseServlet">
<i class="layui-icon layui-icon-survey"></i>
<cite>可选课程</cite>
</a>
<!-- 与上面的列表项类似这个li元素也是创建一个功能链接链接到"studentOptionalCourseServlet" Servlet显示图标和文字说明分别为对应的图标样式和"可选课程",用于跳转到查看可选课程的页面 -->
</li>
<li class="layui-col-xs3">
<a href="${pageContext.request.contextPath}/findStudentByPageServlet">
<i class="layui-icon layui-icon-survey"></i>
<cite>本院学生信息</cite>
</a>
<!-- 同样的结构,链接指向"findStudentByPageServlet" Servlet显示图标和文字说明用于跳转到查询本院学生信息的页面 -->
</li>
<li class="layui-col-xs3">
<a href="${pageContext.request.contextPath}/teacherListServlet">
<i class="layui-icon layui-icon-user"></i>
<cite>本院教师信息</cite>
</a>
<!-- 链接到"teacherListServlet" Servlet图标样式换为表示用户的图标layui-icon layui-icon-user文字说明为"本院教师信息",用于查看本院教师相关信息 -->
</li>
<li class="layui-col-xs3">
<a href="${pageContext.request.contextPath}/cdcListServlet">
<i class="layui-icon layui-icon-set"></i>
<cite>学院专业查询</cite>
</a>
<!-- 链接到"cdcListServlet" Servlet图标样式为另一种layui-icon layui-icon-set文字说明是"学院专业查询",用于进行学院专业相关信息的查询操作 -->
</li>
<li class="layui-col-xs3">
<a href="${pageContext.request.contextPath}/studentInfomationServlet">
<i class="layui-icon layui-icon-set"></i>
<cite>个人信息</cite>
</a>
<!-- 链接到"studentInfomationServlet" Servlet图标样式和文字说明用于跳转到查看或修改个人信息的页面 -->
</li>
<li class="layui-col-xs3">
<a href="${pageContext.request.contextPath}/studentPasswordIndexServlet">
<i class="layui-icon layui-icon-survey"></i>
<cite>修改密码</cite>
</a>
<!-- 链接到"studentPasswordIndexServlet" Servlet图标样式搭配文字说明用于进入修改密码的功能页面 -->
</li>
<li class="layui-col-xs3">
<a href="${pageContext.request.contextPath}/fileListServlet">
<i class="layui-icon layui-icon-survey"></i>
<cite>文件列表</cite>
</a>
<!-- 链接到"fileListServlet" Servlet图标样式与文字说明对应查看文件列表的功能点击可跳转到相应页面 -->
</li>
</ul>
</div>
</div>
<div class="layui-card">
<!-- 再创建一个layui框架的卡片组件用于展示另一部分内容 -->
<div class="layui-card-header">学校最新公告</div>
<!-- 创建卡片头部元素,显示文本为"学校最新公告",用于给下面的公告内容添加标题说明 -->
<c:forEach items="${notifys}" var="notify">
<!-- 使用JSTL的forEach标签来进行循环遍历操作循环的对象是名为"notifys"的数据集合(这个集合通常是从后端传递过来的学校公告信息列表),每次循环将当前元素赋值给变量"notify" -->
<div class="layui-card-body" id="notify">${notify.notifyInfo}<p>${notify.notifyDate}</div>
<!-- 在每个循环中创建一个用于显示卡片主体内容的div元素设置id为"notify"虽然这里id重复使用了可能不太规范但根据代码逻辑应该是想统一设置样式等通过EL表达式展示公告的具体信息${notify.notifyInfo}),后面跟着一个段落标签(<p>再通过EL表达式展示公告的发布日期${notify.notifyDate}),但这里缺少闭合的</p>标签,可能是代码遗漏,正确应该是<</p>来闭合段落标签,用于在页面上展示每条公告的详细内容和发布时间 -->
</c:forEach>
</div>
</div>
</div>
<jsp:include page="/footer.jsp"></jsp:include>
<!-- 包含名为footer.jsp的页面一般该页面用于展示页面底部的一些通用信息比如版权声明、网站相关链接、联系方式等内容 -->
</div>
<script type="text/javascript">
$("#nav li:nth-child(1)").addClass("layui-nav-itemed");
// 使用jQuery选择器选中页面中id为"nav"的元素下的第1个子元素li并为其添加类名"layui-nav-itemed"在layui框架里这个类名可能用于控制导航菜单的展开或折叠状态使得对应的菜单层级结构展示相应的效果方便用户查看相关子菜单这里是对第1个菜单项进行此操作
$("#nav li:nth-child(2)").addClass("layui-nav-itemed");
// 对id为"nav"的元素下的第2个子元素li添加"layui-nav-itemed"类名,作用同上,用于处理对应的导航菜单状态
$("#nav li:nth-child(3)").addClass("layui-nav-itemed");
// 对第3个li元素添加类名控制对应菜单状态
$("#nav li:nth-child(4)").addClass("layui-nav-itemed");
// 对第4个li元素添加类名控制对应菜单状态
$("#nav li:nth-child(5)").addClass("layui-nav-itemed");
// 对第5个li元素添加类名控制对应菜单状态具体效果都依赖layui框架对于该类名的样式和交互逻辑定义
</script>
</body>
</html>