spring mvc+spring+mybatis+ajax实现登录验证

<h1>Spring Mvc+Spring+Mybatis+Ajax 实现异步登录的例子，和大家分享一下。</h1><div>login.js代码:</div><pre name="code" class="javascript">$(document).ready(function(){$("#tname").blur(function(){$.ajax({type:"post",url:"checklogin.do",data:{tname:$("#tname").val()},dataType:"text",beforeSend:function(){$("#btn").val("正在提交，请稍等...");}, success:function(data){//判断输入是否成功，成功则跳转   if("用户名可用!"==data){$("#tn").addClass("tn");$("#btn").val("Login");}else{$("#tn").removeClass("tn").addClass("tnx");$("#btn").val("Login"); return false;}                           }   });});$('#btn').click(function(){if($("#tname").val()=="请输入用户名" || $("#tname").val()==""||$("#password").val()=="请输入密码"|| $("#password").val()==""){$("#msg").html("用户名不能为空！");return false;}else{$.ajax({type:"post",url:"login.do",data:{tname:$("#tname").val(),tpwd:$("#password").val()},dataType:"text",beforeSend:function(){$("#btn").val("正在提交，请稍等...");}, success:function(data){//判断输入是否成功，成功则跳转   if("用户名可用!"==data){window.location.href="index.jsp";    }else{$("#key").addClass("key");$("#btn").val("Login");return false;}                         }   });}})});

<pre name="code" class="java">package com.bky.controller;import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;import javax.servlet.ServletContext;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;import org.jboss.weld.servlet.ServletApiAbstraction;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;import com.bky.model.Add;
import com.bky.service.BaseService;@Controller
public class Login {@AutowiredBaseService baseService;@RequestMapping("checklogin") public String checkLogin(Add adds,HttpServletRequest request, HttpServletResponse response,Model model) throws IOException {      //获取页面传过来的账号String tname=adds.getTname();adds.setTname(tname);String mes="用户名可用!";Add add=baseService.selectByName(adds);//判断用户名是否正确，正确则登录，错误则提示重新输入if(add!=null){response.setContentType("text/plain;charset=UTF-8");response.getWriter().write(mes);}else{mes="用户名不正确！";//设置字符集response.setContentType("text/plain;charset=UTF-8");response.getWriter().write(mes);}return null;}@RequestMapping("login")    public String Login(Add adds,HttpServletRequest request, HttpServletResponse response,Model model) throws IOException {//获取页面传过来的账号和密码String tname=adds.getTname();String tpwd=adds.getTpwd();adds.setTname(tname);adds.setTpwd(tpwd);String mes="用户名可用!";Add add=baseService.selectByNP(adds);//判断用户名及密码是否正确，正确则登录，错误则提示重新输入if(add!=null){//设置字符集response.setContentType("text/plain;charset=UTF-8");response.getWriter().write(mes);}else{mes="用户名或密码不正确！";response.setContentType("text/plain;charset=UTF-8");response.getWriter().write(mes);}return null;}
}

<pre name="code" class="html"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><base href="<%=basePath%>"><title>Login</title><meta name="viewport" content="width=device-width, initial-scale=1"><script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script><meta name="keywords" content="Flat Dark Web Login Form Responsive Templates, Iphone Widget Template, Smartphone login forms,Login form, Widget Template, Responsive Templates, a Ipad 404 Templates, Flat Responsive Templates" />   <link href="css/style.css" rel='stylesheet' type='text/css' /><script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/login.js"></script></head><body><script>$(document).ready(function(c) {$('.close').on('click', function(c){$('.login-form').fadeOut('slow', function(c){$('.login-form').remove();});});
});
</script><h1>登录</h1><div class="login-form"><div class="close"> </div><div class="head-info"><label class="lbl-1"> </label><label class="lbl-2"> </label><label class="lbl-3"> </label></div><div class="clear"> </div><div class="avtar"><img src="data:images/avtar.png" /></div><form>         <div id="tn"><input type="text"    id="tname" name="username" onFocus="this.value = '';" onBlur="if (this.value == '') {this.value = '请输入用户名';}"></div><div id="key"><input type="password" id="password" name="password"  onFocus="this.value = '';" onBlur="if (this.value == '') {this.value = '请输入密码';}"></div></form><div class="signin"><input type="submit" value="Login" id="btn"></div></div><div class="copy-rights"><p>Copyright &copy; 2015.Company name All rights reserved.</p></div></body>
</html>

参考文章：

https://blog.csdn.net/yikong2yuxuan/article/details/50402725

https://blog.csdn.net/yanglong_blog_/article/details/78480192

spring mvc+spring+mybatis+ajax实现登录验证相关推荐

SSM框架实现用户查询、注册、登录——IDEA整合Spring、Spring MVC、Mybatis 框架
目录零.前言一.说明 1.整合说明 2.最终目标 3.数据库准备二.搭建整合环境 1.创建 maven 工程 2.导入依赖坐标 3.创建java和resources文件夹 4.创建类和接口文件 ...
Spring MVC+Spring+Mybatis+MySQL(IDEA)入门框架搭建
目录 Spring MVC+Spring+Mybatis+MySQL(IDEA)入门框架搭建 0.项目准备 1.数据持久层Mybatis+MySQL 1.1 MySQL数据准备 1.2 Mybatis ...
Spring 5 + Spring MVC 5 + MyBatis 3 的 Maven 项目集成
相关链接: MyEclipse CI 2018.9.0 配置 Apache Maven 3.5.4 在MyEclipse CI 2018.9.0 中使用 Maven 3.5.4 创建Maven项目在 ...
Spring mvc+ maven + MyBatis + Oracle + IDEA 项目搭建 - framework 进阶中（一）
原文链接 http://blog.csdn.net/qq184377902/article/details/51493642 结合自身情况加以修改搭建的框架,记录以防备忘,方便日后学习参考. Befo ...
Java泛型之mybatis,基于spring MVC 和 MyBatis 泛型的代码生成模板
原标题:基于spring MVC 和 MyBatis 泛型的代码生成模板简单说明这块代码生成工具是我抽空的时候方便自己使用而编写的,并不适合其他框架,这里由于项目原有,我并没有上传泛型部份的代码, ...
mvc 一般注释_使用带有注释和JQuery的Spring MVC 3的Ajax
mvc 一般注释与Ajax一起工作对我来说一直很有趣! 是不是 ? 我将使您轻松将Ajax与Spring MVC 3和JQuery结合使用. 这篇文章将向您说明如何在工业编码的现实生活中使用Ajax ...
使用带有注释和JQuery的Spring MVC 3的Ajax
与Ajax一起工作对我来说一直很有趣! 是不是 ? 我将使您轻松将Ajax与Spring MVC 3和JQuery结合使用. 这篇文章将向您说明如何在工业编码的现实生活中使用Ajax. 和往常一样,我 ...
Spring MVC+Spring+Mybatis实现支付宝支付功能（图文详解）(转载)
Spring MVC+Spring+Mybatis实现支付宝支付功能(图文详解) 前言本教程详细介绍了如何使用ssm框架实现支付宝支付功能.本文章分为两大部分,分别是「支付宝测试环境代码测试」和「将 ...
Spring Mvc + Spring + Mybatis3 搭建Web工程详解
Spring MVC + Spring + Mybatis3 搭建Web工程原理可能需要用到参考: Maven创建web项目:http://blog.csdn.net/liangmaoxuan/ar ...

spring mvc+spring+mybatis+ajax实现登录验证

spring mvc+spring+mybatis+ajax实现登录验证相关推荐

最新文章

热门文章