JQuery实现异步验证用户名是否存在

最新推荐文章于 2022-01-13 18:01:14 发布

轻尘×

最新推荐文章于 2022-01-13 18:01:14 发布

阅读量1.5k

点赞数 3

分类专栏： jquer 文章标签： jquery servlet ajax 异步 jsp

本文链接：https://blog.csdn.net/leisure_life/article/details/73472421

版权

该博客介绍了如何在用户注册时利用jQuery的AJAX功能，实时检查用户名的可用性。通过结合jsp和servlet，实现了异步验证过程，确保了用户体验。示例中使用了jquery-1.7.2.min.js库，并提供了简单的jsp和Servlet代码片段。

摘要由CSDN通过智能技术生成

用户在注册时，最好在用户填写完用户名时就感知用户名是否合法。

实现的方法有多种，js、ajax等等，这里采用jquery封装的ajax实现

效果

采用jsp+servlet的模式实现案例

使用的是jquery-1.7.2.min.js

jsp代码如下：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>异步请求测试</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="Style/Style.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
</head>
<script language="JavaScript">
//异步验证用户名是否存在
function validatorloginName(){
    
    var loginName=document.getElementById("loginName").value; 
   if(loginName == ""){
       alert("用户名不能为空!");
       return;
       }
   $.ajax({
       type: "POST",      //请求方式
        url: "CheckUserName",//验证的Servlet路径    
         data: "loginName="+loginName,   //参数
        success: function(data){