jsp实现评论区折叠,代码实现
时间: 2023-08-27 16:05:15 浏览: 44
以下是一个简单的JSP代码实现评论区折叠的例子:
```jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>评论区折叠</title>
</head>
<body>
<%
// 模拟从数据库中获取评论数据
List<String> comments = new ArrayList<>();
comments.add("评论1");
comments.add("评论2");
comments.add("评论3");
comments.add("评论4");
// 初始折叠状态为折叠
boolean folded = true;
// 如果有评论,则显示评论区
if (comments.size() > 0) {
%>
<h3><a href="#" onclick="toggleFold()">评论区</a></h3>
<div id="commentArea" style="display: none;">
<% for (String comment : comments) { %>
<p><%= comment %></p>
<% } %>
</div>
<%
}
%>
<script>
function toggleFold() {
var commentArea = document.getElementById("commentArea");
if (commentArea.style.display == "none") {
commentArea.style.display = "block";
} else {
commentArea.style.display = "none";
}
}
</script>
</body>
</html>
```
在上面的例子中,我们模拟从数据库中获取了一些评论数据,然后根据评论数量来决定是否显示评论区。当用户点击“评论区”链接时,会调用 `toggleFold()` 函数来切换评论区的折叠状态。当评论区被折叠时,其 `display` 属性为“none”,当评论区展开时,其 `display` 属性为“block”。