力所能及之springmvc+ajax+jquery+json实现登录异步校验用户名是否存在

最新推荐文章于 2022-07-19 21:32:51 发布

张小竟

最新推荐文章于 2022-07-19 21:32:51 发布

阅读量4.8k

点赞数 1

分类专栏： springmvc 文章标签： springMVC 登录异步校验用户名是否存在

本文链接：https://blog.csdn.net/zhanglu1236789/article/details/45288857

版权

springmvc 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

小狼最近在想能不能用springmvc实现后台异步校验

开发环境：windows7纯净版 myeclipse8.6 jquery-1.3.2

需要jar文件：

工程目录：、

各类配置文件配置：

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" 
	xmlns="http://java.sun.com/xml/ns/javaee" 
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
	http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>
  <servlet>
		<servlet-name>springMVC</servlet-name>
		<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
		<load-on-startup>1</load-on-startup>
		
	</servlet>
	<servlet-mapping>
		<servlet-name>springMVC</servlet-name>
		<url-pattern>*.zcy</url-pattern>
	
	</servlet-mapping>
</web-app>

springMVC-servlet.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:p="http://www.springframework.org/schema/p"
	xmlns:context="http://www.springframework.org/schema/context"
	xsi:schemaLocation="
        http://www.springframework.org/schema/beans 
        http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
        http://www.springframework.org/schema/context 
        http://www.springframework.org/schema/context/spring-context-3.0.xsd">
	<context:component-scan base-package="qh.zcy.controller" />
	<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver" p:prefix="/"></bean>
</beans>

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  
    <title>My JSP 'index.jsp' starting page</title>
	
  </head>
  <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
  <!--<script type="text/javascript" src="js/json2.js"></script>
  --><script type="text/javascript">
     $(function(){
         $("#username").mouseleave(function(){  
              var username=$("#username").val();
              if(username==""){  
                   $("#msg").html("用户名不为空");  
                   return ;  
              } 
               $.post("login.zcy", {
                    username: username
                }, function(data){
                     $("#msg").html(data);
                });
                $("#password").click(function(){
                    
                     $("#msg").html(null);
                })
         });
     
     });
  
  </script>
  <body>
       <form action="" method="post" >
          username:<input type="text" name="username" id="username"><br/>
          password:<input type="text" name="password" id="password"><br> 
          <input type="submit" value="submit">
          <div id="msg"></div>
       </form>
  </body>
</html>

package qh.zcy.controller;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.http.HttpServletResponse;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class Login {

	@RequestMapping("/login")
	public String login(String username,HttpServletResponse response){
		System.out.println("Login username="+username);

		response.setContentType("text/html");
		response.setCharacterEncoding("utf-8");
		PrintWriter out=null;
		try {
			out=response.getWriter();
			if(username.equals("admin")){
				out.println("此用户名已存在");
			}else{
				out.println("此用户名可以使用");
			}
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		
		return null;
	}
}

如此。就完成了springmvc的异步校验

输入路径：http://localhost:8080/spring2/login.jsp

什么都不填，显示如下：

输入用户名为admin，显示如下：

输入用户名为其他，显示如下：

小狼现在只想说ok