<%@ page contentType="text/html;charset=UTF-8" language="java" %><html> <head> <title>ajax</title> <script src="/ajax/js/jquery-3.3.1.min.js"></script> </head> <body> <form action="http://www.ubfgho.com/" method="post" enctype="application/x-www-form-urlencoded"> 姓名：<input type="text" name="name"><span></span><br> 密码：<input type="password" name="psw"><br> <input type="submit" value="提交"><br> </form> </body> <script> //js实现post方式的异步请求 $(‘:text‘).blur(function () { var name1=$(this).val().trim() //1、创建发送异步请求的对象req var req=XMLHttpRequest(); //2、准备发送 req.open("POST","ajax/login",true) //3、设置请求头 req.setRequestHeader("Content-type","application/x-www-form-urlencoded") //4、发送 req.send("name"+name1)
//回调参数 req.onreadystatechange=function () { if (req.readyState==4&&req.status==200){ $("span").html(req.responseText).css("color","red") } } })
//1、失去焦点事件--判断姓名是否为空 $(‘:text‘).blur(function () { var v=$(this).val() if (v.trim()==""){ $("span").html("姓名为空").css("color","red") }else{ $("span").html("")//清空span } }) //2、提交事件---点击提交按钮触发submit $("form").submit(function () { //选中text文本 var v=$(‘:text‘).val().trim(); if (v==""){ //如果姓名为空。就返回false，阻止提交， return false } })
</script></html>
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String name=request.getParameter("name"); boolean b=dao.selectName(name); String msg=b?"用户名已被占用":"用户名正常"; response.setContentType("text/html;charset=UTF-8"); response.getWriter().write(msg);}
原文地址：https://www.cnblogs.com/xiaoshenke/p/10996992.html
时间： 2024-08-15 19:51:52