基于spring boot不连接数据库使用AJAX编写程序简单实现判断表单中的用户名是否存在
-
首先,需要在pom.xml文件中添加spring-boot-starter-web依赖。
-
创建一个Controller类,并添加一个RequestMapping注解,用于处理AJAX请求。
-
在Controller类中添加一个方法,用于接收AJAX请求,并返回一个布尔值,表示用户名是否存在。
-
在该方法中,根据请求中传递的用户名参数,判断用户名是否存在。如果存在,则返回true,否则返回false。
-
在前端页面中,使用jQuery的ajax方法发送请求,并接收响应结果。根据响应结果,可以动态地更新页面内容。
以下是一个简单的示例:
Controller类:
@RestController
public class UserController {
@RequestMapping(value = "/checkUsername", method = RequestMethod.GET)
public boolean checkUsername(@RequestParam("username") String username) {
// 模拟判断用户名是否存在
return "admin".equals(username);
}
}
前端页面:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>判断用户名是否存在</title>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script>
$(function () {
$("#username").blur(function () {
var username = $(this).val();
$.ajax({
url: "/checkUsername",
data: {username: username},
success: function (result) {
if (result) {
$("#username_msg").html("用户名已存在");
} else {
$("#username_msg").html("");
}
}
});
});
});
</script>
</head>
<body>
<form>
<label for="username">用户名:</label>
<input type="text" id="username" name="username">
<span id="username_msg"></span>
</form>
</body>
</html>
在上面的示例中,当用户在表单中输入用户名后,失去焦点时会触发AJAX请求,请求的URL为“/checkUsername”,同时将用户名作为参数传递。服务器端接收请求后,根据用户名判断是否存在,并将结果返回给前端。前端根据返回结果更新页面内容。
原文地址: https://www.cveoy.top/t/topic/b3iO 著作权归作者所有。请勿转载和采集!