问题遇到的现象和发生背景
我想按照书上的这样在一个页面中使用ajax判断用户名输入状态,但是一直实现不了,谁能告诉我怎么弄
用代码块功能插入代码,请勿粘贴截图
jsp页面代码:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
#div {
width: 150px;
height: 150px;
position: absolute;
border: 1px solid;
left: 200px;
top: 50px;
display: none;
}
#check {
display: none;
}
</style>
</head>
<body>
<jsp:useBean id="ub" class="test1.Test1"></jsp:useBean>
<jsp:setProperty property="s" name="ub" value="${name }"/>
<form action="">
用户名: <input id="name" name="name"><button onclick="check()">检测用户名</button><br/>
密码: <input type="password" id="pwd" name="pwd"><br/>
<input id="check" value="${pageScope.ub.find() }">
<input type="submit" value="按钮">
<div id="div"></div>
</form>
</body>
<script type="text/javascript" src="http://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
var http_request = new XMLHttpRequest();
var div = $("#div");
div.on("load", function(){
if ($("#check").val() === -1) {//设置提示内容
div.text("该用户未注册");
}else {
div.text("该用户已注册");
}
});
function createRequest(url) {
//创建XMLHttpRequest主方法体
var http_request = false;
if (window.XMLHttpRequest) {
//判断使用的浏览器是否为ie浏览器
http_request = new XMLHttpRequest();
}else if (window.ActiveXObject){
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
}catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}catch (e) {
}
}
if (http_request) {
//如果使用XMLHttpRequst不支持的浏览器则无法创建对象
alert("不能创建对象");
return false;
}
}
http_request.onreadystatechange = get_result; //调用返回结果处理函数
http_request.open("GET", url + ",true"); //创建与服务器的连接
http_request.send(null); //向服务器发送请求
}
function get_result() {
if (http_request.status === 4) { //判断请求状态
if (http_request.status === 200) { //请求成功,开始处理返回结果
check();
}else {
alert("访问错误");
}
}
}
function check() {
//创建检查方法
var username = $("#name").val();
if (username === "") {
alert("请输入用户名");
username.focus();
return;
}else {
div.show(); //显示提示框
setTimeout(function () {
div.hide();
},3000);
//3秒后隐藏
createRequest("test.jsp?name=" + username);
}
}
</script>
</html>
javabean代码:
package test1;
import java.util.ArrayList;
import java.util.List;
public class Test1 {
private String s;
private int i;
public Test1() {
List<String> list = new ArrayList<>();
list.add("zhangsan");
list.add("lisi");
list.add("wangwu");
i = list.indexOf(getS());
}
public String getS() {
return s;
}
public void setS(String s) {
this.s = s;
}
public int find() {
return i;
}
}
运行结果及报错内容
我想要达到的结果
平台的付费悬赏金额最低限度太高,如果有人愿意帮我解答,并且本人亲测没问题后,本人愿意付少量金额当做酬劳