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

目录结构

没有涉及到数据库

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. LiquiBase实战总结

    LiquiBase概述 Liquibase是一个用于跟踪.管理和应用数据库变化的开源的数据库重构工具.它将所有数据库的变化(包括结构和数据)都保存在XML文件中,便于版本控制. Liquibase具备 ...

  2. Matrix: android 中的Matrix (android.graphics.Matrix) (转)

    本篇博客主要讲解一下如何处理对一个Bitmap对象进行处理,包括:缩放.旋转.位移.倾斜等.在最后将以一个简单的Demo来演示图片特效的变换. 1. Matrix概述 对于一个图片变换的处理,需要Ma ...

  3. 【PHP】解决数据库查询出来的中文内容显示为问号“??”

    方法一:在数据库连接后执行: mysql_query('SET NAMES utf8'); 代码: $dbconn=mysql_connect("localhost", " ...

  4. Qt编写控件属性设计器8-网络采集

    一.前言 上一篇文章已经打通了数据源之一的串口采集,这次要说的是网络采集,网络通信目前用的最多的是三种,TCP/UDP/HTTP,其中tcp通信又包括了客户端服务端两种,tcp通信才用了多次握手机制不 ...

  5. linux简单命令4---压缩与解压

    1:压缩命令:zip 2:.gz压缩,不能压缩目录,会压缩目录里的文件 3:.bz2压缩,不能压缩目录,直接报错 ------------------------------------------- ...

  6. 123457123456#0#-----com.twoapp.KidsShiZi01--前拼后广--儿童宝宝识字jiemei

    com.twoapp.KidsShiZi01--前拼后广--儿童宝宝识字jiemei

  7. Oracle SQL 脚本跟踪

    NC Oracle SQL 脚本跟踪 脚本: select * from v$sqlarea a and a.LAST_ACTIVE_TIME >= to_date( '2013-02-21 1 ...

  8. Linux hostname介绍

    以下操作均时基于 Centos 6.8 操作. 一.现象 在平时工作中,当需要修改主机名时,我们一般会这样操作: 第一步,通过 hostname 命令临时修改主机名. hostname kwang-t ...

  9. （十）java虚拟机性能监控工具

    一. jps(Java Virtual Machine Process Status Tool) jps主要用来输出JVM中运行的进程状态信息.语法格式如下: 命令行参数选项说明如下: 1.1 案例 ...

  10. rhel7免密登录问题

    以前在做linux免密登录时只要执行:cat id_rsa.pub>> authorized_keys,就可以了 后来升级到rhel7之后不行,发现有两个需要改动: 1.修改ssh的配置文 ...