只是简单的仿某度注册的用户名输入离焦后检验

目录结构

没有涉及到数据库

html
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>校验用户名是否存在</title>

    <script src="js/jquery-3.3.1.min.js"></script>

    <script>

        //页面加载完成后

        $(function () {

            //给用户名输入框定义一个离焦事件

            $("#username").blur(function () {

                //获取文本输入框的值

                var username=$(this).val();

                /* 期望服务器端响应回来的数据格式是这样的（json）:

                        {"userExit":true,"msg":"此用户太受欢迎，请换一个"}

                        {"userExit":false,"msg":"用户名可用"}

                 */

                $.get("findUsernameServlet",{username:username},function (data) {

                    alert(data.msg);

                    var span = $("#s_username")

                    //判断响应回来的数据的键userExit是否为true

                    if (data.usernameExsit){

                        //true 用户名存在

                        span.css("color","red");

                        span.html(data.msg);

                    } else {

                        //false  用户名不存在

                        span.css("color","green");

                        span.html(data.msg);

                    }

                },"json");

            });

        });

    </script>

</head>

<body>

    <form action="" method="get">

        <input type="text" id="username" name="username" placeholder="请输入用户名">

        <span id="s_username"></span><br>

        <input type="password" name="password" placeholder="请输入密码"><br>

        <input type="submit" value="注册">

    </form>

</body>

</html>
java servlet
@WebServlet("/findUsernameServlet")

public class FindUsernameServlet extends HttpServlet {

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        request.setCharacterEncoding("utf-8");

        String username = request.getParameter("username");

        response.setContentType("application/json;charset=utf-8");

        Map<String,Object> map=new HashMap<>();

        /*判断浏览器客户端传过来的数据  username

           true   {"userExit":true,"msg":"此用户太受欢迎，请换一个"}

           false    {"userExit":false,"msg":"用户名可用"}

             */

        if ("tom".equals(username)){

            map.put("usernameExsit",true);

            map.put("msg","此用户太受欢迎，请换一个");

        }else {

            map.put("usernameExsit",false);

            map.put("msg","用户名可用");

        }

        //java:map-->json

        ObjectMapper mapper=new ObjectMapper();

        mapper.writeValue(response.getWriter(),map);

    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        this.doPost(request, response);

    }

}

校验用户名是否存在(ajax+jackson)的更多相关文章

  1. Ajax详解及其案例分析------如何获得Ajax对象，使用Ajax对象发送GET和POST请求，校验用户名，POST和GET请求时的乱码处理，实现级联的下拉列表

    本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...

  2. ajax案例_校验用户名

    目录 ajax案例_校验用户名 代码下载 需求 流程 搭建环境 开发代码 1_jsp 1_servlet 1_service.dao 2_servlet 2_jsp 测试后,功能实现,完结撒花 aja ...

  3. 十七 Ajax&校验用户名功能

    Ajax: 即"Asynchronous JavaScript And XML", 异步JavaScript和XML , 是指一种创建的交互式页面应用的网页开发技术,它并不是新的技 ...

  4. 零基础学习java------35---------删除一个商品案例，删除多个商品，编辑（修改商品信息），校验用户名是否已经注册（ajax）

    一. 删除一个商品案例 将要操作的表格 思路图  前端代码 <%@ page language="java" contentType="text/html; cha ...

  5. 【JAVAWEB学习笔记】22_ajax：异步校验用户名和站内查询

    Js原生Ajax和Jquery的Ajax 学习目标 案例1-异步校验用户名是否存在 案例2-站内查询 一.Ajax概述 1．什么是同步,什么是异步 同步现象:客户端发送请求到服务器端,当服务器返回响应 ...

  6. day78_淘淘商城项目_11_单点登录系统实现 + 用户名回显 + ajax请求跨域问题详解_匠心笔记

    课程计划 1.SSO注册功能实现 2.SSO登录功能实现 3.通过token获得用户信息 4.ajax跨域请求解决方案--jsonp 1.服务接口实现   SSO系统就是解决分布式环境下登录问题的,本 ...

  7. 案例16-validate自定义校验规则校验用户名是否存在

    1 知识点 2 register.jsp代码 注意自定义校验规则的时候,提交必须是同步的方式. <%@ page language="java" contentType=&q ...

  8. JQuery去实现校验用户名

    JQuery 是什么? javascript 的代码框架. 有什么用? 简化代码,提高效率. 核心 write less do more , 写得更少,做的更多. load //找到这个元素, 去执行 ...

  9. Python校验用户名是否合法示例

    #校验用户名是否合法例子: #输入账号密码 #input #如果账号存在提示已经注册,如果不存在的,就可以注册 all_users [] #不能为空 #strip() #用户名长度6-12之间 #le ...

随机推荐

  1. delphi 获得父目录–指定级父目录

    function get_dir_parent(dir:string;n:integer):string; //n为几级父目录varst:string;i:integer;begin st:=GetC ...

  2. php接口数据安全解决方案（一）

    前言 目录介绍 登录鉴权图 接口请求安全性校验整体流程图 代码展示 演示用户登录 演示获取用户信息 文章完整代码地址 后记 前言 目的: 1.实现前后端代码分离,分布式部署 2.利用token替代se ...

  3. SurfaceView概述和基本使用

    Android屏幕刷新一遍时间间隔为16ms,如果view能够在16ms内完成所需要执行的绘图换作,那么在视觉上,界面就是流畅的,否则就会出现卡顿现象,在很多情况下,这些逻辑处理又是必须的,为了解决这 ...

  4. jvm 指令重排

    引言:在Java中看似顺序的代码在JVM中,可能会出现编译器或者CPU对这些操作指令进行了重新排序:在特定情况下,指令重排将会给我们的程序带来不确定的结果..... 1.  什么是指令重排? 在计算机 ...

  5. 【设计】PC Web端框架组件

    https://uedart.com/demo/templatesWebKit/index.html#g=1&p=%E4%BD%9C%E5%93%81%E9%A6%96%E9%A1%B5 移动 ...

  6. SecureCRT 8.1破解方式

    百度网盘下载,里面有破解程序和破解方式. 链接: https://pan.baidu.com/s/1wlhqnn-TE_mcOXOLljP-zg 密码: 3ffj

  7. python多进程实例详解

    写在前面:python中的多线程其实并不是真正的多线程,如果想要充分地使用多核CPU的资源,在python中大部分情况需要使用多进程.Python提供了非常好用的多进程包multiprocessing ...

  8. linux中安装docker

    uname -r yum remove docker \ docker-client \ docker-client-latest \ docker-common \ docker-latest \ ...

  9. 2019-11－8 Linux作业 李宗盛

    linux系统的特点:完全免费,高效,安全稳定.支持多种硬件平台.有好的用户界面.强大的网络功能.支持多任务多用户. linux一般有三个主要部分:内核.命令解释层.实用工具. 那合适系统的心脏,是运 ...

  10. 【数据库开发】Redis key-value内存数据库介绍

    Redis是一个开源的,先进的 key-value 存储可用于构建高性能,可扩展的 Web 应用程序的解决方案.Redis官方网网站是:http://www.redis.io/,如下: Redis 有 ...