写一个功能用ajax,如果数据库里面一个值=1他会=禁用0=启用,在jsp页面中有他会显示数据库那个值的状态,如果本人是启用,那么后面会有一个禁用,点击禁用后那个状态会变成禁用 而他的操作会变成启用
时间: 2024-03-27 08:37:44 浏览: 86
以下是实现该功能的代码:
首先是前端的JSP页面:
```
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>禁用/启用功能</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<h2>禁用/启用功能</h2>
<p>当前状态:<span id="status"></span></p>
<button id="toggleBtn"></button>
<script>
$(function() {
// 页面加载时获取当前状态
$.ajax({
url: "getStatus.jsp",
type: "GET",
dataType: "text",
success: function(data) {
if (data == "1") {
$("#status").text("启用");
$("#toggleBtn").text("禁用");
} else {
$("#status").text("禁用");
$("#toggleBtn").text("启用");
}
}
});
// 点击按钮切换状态
$("#toggleBtn").click(function() {
$.ajax({
url: "toggleStatus.jsp",
type: "POST",
dataType: "text",
success: function(data) {
if (data == "1") {
$("#status").text("启用");
$("#toggleBtn").text("禁用");
} else {
$("#status").text("禁用");
$("#toggleBtn").text("启用");
}
}
});
});
});
</script>
</body>
</html>
```
其中,`getStatus.jsp` 和 `toggleStatus.jsp` 分别用于获取当前状态和切换状态,代码如下:
`getStatus.jsp`:
```
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
// 获取当前状态,这里假设状态保存在名为 "status" 的表中的一个名为 "value" 的字段中
int status = 0;
try {
// 这里省略获取数据库连接池和创建 Statement 的代码
ResultSet rs = stmt.executeQuery("SELECT value FROM status");
if (rs.next()) {
status = rs.getInt(1);
}
} catch (SQLException e) {
e.printStackTrace();
}
out.print(status);
%>
```
`toggleStatus.jsp`:
```
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
// 切换状态,这里假设状态保存在名为 "status" 的表中的一个名为 "value" 的字段中
int newStatus = 0;
try {
// 这里省略获取数据库连接池和创建 Statement 的代码
ResultSet rs = stmt.executeQuery("SELECT value FROM status");
if (rs.next()) {
int oldStatus = rs.getInt(1);
newStatus = 1 - oldStatus;
stmt.executeUpdate("UPDATE status SET value=" + newStatus);
}
} catch (SQLException e) {
e.printStackTrace();
}
out.print(newStatus);
%>
```
以上代码中,需要注意的是:
1. 状态保存在数据库中,需要先获取数据库连接池并创建 Statement。
2. `toggleStatus.jsp` 中使用了一个简单的方法切换状态:通过取反运算得到新状态的值,然后执行 UPDATE 语句更新数据库中的值。
3. `toggleStatus.jsp` 中的 `out.print(newStatus)` 用于将新状态的值返回给前端,前端根据该值更新页面显示。
阅读全文