|
|
<%@ 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;
|
|
|
第二行引入了JSTL(JavaServer Pages Standard Tag Library)核心标签库,通过指定的前缀“c”,后续就能在页面中方便地使用该库提供的各种标签进行逻辑处理、数据展示等操作 -->
|
|
|
<html>
|
|
|
<head>
|
|
|
<title>公告列表</title>
|
|
|
<!-- 设置当前HTML页面的标题为“公告列表”,这个标题通常会显示在浏览器的标题栏位置 -->
|
|
|
<link rel="stylesheet" href="./css/layui.css">
|
|
|
<!-- 引入layui框架的样式表文件,layui.css中定义了诸多用于页面布局、组件样式等方面的样式规则,能帮助快速搭建出具有一定风格的页面 -->
|
|
|
<link rel="stylesheet" href="./css/style.css">
|
|
|
<!-- 引入自定义的style.css样式文件,这里面可以包含针对当前页面特殊需求所定制的一些样式,用于覆盖或补充layui框架样式的不足 -->
|
|
|
<script src="./layui.js"></script>
|
|
|
<!-- 引入layui框架对应的JavaScript脚本文件,layui.js包含了实现各种交互功能、组件逻辑等的代码,是页面实现动态效果的重要依赖 -->
|
|
|
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
|
|
|
<!-- 引入jQuery库,jQuery是一个非常流行的JavaScript库,它提供了简洁易用的方法来操作DOM元素、处理事件、实现动画效果等,方便前端开发 -->
|
|
|
</head>
|
|
|
<body class="layui-layout-body" style="background-color: #F2F2F2">
|
|
|
<!-- 设置页面主体的类名为“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”页面,一般来说,这个页面用于构建学生端页面的头部区域,比如展示学校标识、学生相关的功能菜单等 -->
|
|
|
<jsp:include page="/WEB-INF/student/studentNav.jsp"></jsp:include>
|
|
|
<!-- 包含“/WEB-INF/student/studentNav.jsp”页面,大概率是用于生成学生端的导航栏,方便学生在不同的功能模块或页面之间进行切换 -->
|
|
|
<div class="layui-layout layui-layout-admin">
|
|
|
<div class="layui-body">
|
|
|
<!-- 这里是layui框架中用于承载页面主要内容的部分,也就是内容主体区域 -->
|
|
|
<div style="padding: 15px;">
|
|
|
<span class="layui-breadcrumb">
|
|
|
<a>学生端</a>
|
|
|
<a><cite>公告列表</cite></a>
|
|
|
</span>
|
|
|
<!-- 展示面包屑导航,通过这种方式可以清晰地向学生展示当前页面在整个学生端系统层级结构中的位置,便于他们了解所处的页面路径 -->
|
|
|
<p> </p>
|
|
|
|
|
|
<table class="layui-table" lay-filter="test">
|
|
|
<thead>
|
|
|
<tr>
|
|
|
<th>公告ID</th>
|
|
|
<th>公告日期</th>
|
|
|
<th>公告内容</th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
<!-- 定义表格的表头部分,分别创建了三个列标题,用于表示公告的ID、发布日期以及具体的内容,后续数据会按照这个表头结构进行展示 -->
|
|
|
<c:forEach items="${notifys}" var="notify" varStatus="n">
|
|
|
<tr>
|
|
|
<td>${n.count}</td>
|
|
|
<td>${notify.notifyDate}</td>
|
|
|
<td>${notify.notifyInfo}</td>
|
|
|
</tr>
|
|
|
</c:forEach>
|
|
|
<!-- 使用JSTL的forEach标签对名为“notifys”的集合进行循环遍历,这个集合通常是从后端传递过来的公告数据列表。
|
|
|
对于列表中的每一个公告元素(用“notify”变量表示),创建表格中的一行(<tr>标签)来展示对应公告的数据:
|
|
|
第一个<td>单元格展示序号(通过varStatus的count属性实现,从1开始计数);
|
|
|
第二个<td>单元格展示公告的发布日期;
|
|
|
第三个<td>单元格展示公告的具体内容 -->
|
|
|
</table>
|
|
|
|
|
|
<jsp:include page="/footer.jsp"></jsp:include>
|
|
|
<!-- 包含“/footer.jsp”页面,通常这个页面用于展示页面底部的相关信息,比如版权声明、联系方式、页面底部的导航链接等内容 -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
//JavaScript代码区域,以下代码用于初始化layui框架的相关功能模块
|
|
|
layui.use('element', function(){
|
|
|
var element = layui.element;
|
|
|
element.init();
|
|
|
});
|
|
|
// 通过layui.use方法调用“element”模块,并在回调函数中获取该模块的实例(赋值给“element”变量),然后调用其“init”方法进行初始化操作。
|
|
|
// “element”模块通常用于处理页面元素相关的交互逻辑,例如菜单的展开与收起、选项卡的切换等功能的初始化
|
|
|
</script>
|
|
|
</body>
|
|
|
</html> |