package cn.hopetesting.com.servlet;

import com.fasterxml.jackson.databind.ObjectMapper;

import javax.print.attribute.standard.JobOriginatingUserName;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;

/**
 * @author newcityman
 * @date 2019/9/18 - 21:49
 */
@WebServlet("/findUserServlet")
public class FindUserServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
          response.setContentType("application/json;charset=utf-8");
//          response.setContentType("text/html;charset=utf-8");
          //1、获取参数username
        String username = request.getParameter("username");
        //2、调用service层判断用户名是否存在
        //期望服务器响应回的数据格式：{
        //("userExist:true,"msg","此用户名太受欢迎，请更换一个")，
        // ("userExist:false,"msg","此用户名可用")}
        Map<String,Object> map = new HashMap<String,Object>();
        if("tom".equals(username)){
            //存在
            map.put("userExist",true);
            map.put("msg","此用户名太受欢迎，请更换一个");
        }else{
            //不存在
            map.put("userExist",false);
            map.put("msg","此用户名可用");
        }
        //将map转换为json，并且传递给客户端
        //将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);
    }
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>register</title>
    <script src="js/jquery-3.3.1.min.js"></script>
    <script>
        //页面加载完成后
       $(function () {
           //给username绑定blur时间
           $("#username").blur(function () {
               //获取username文本输入框的值
               var username = $(this).val();
               //发送ajax请求
               //期望服务器响应回的数据格式：{
               //("userExist:true,"msg","此用户名太受欢迎，请更换一个")，
               // ("userExist:false,"msg","此用户名可用")}
               $.get("findUserServlet",{username:username},function (data) {
                  //判断userExist键的值是否存在

                   var span = $("#s_username");
                   if(data.userExist){
                       //存在
                       span.css("color","red");
                       span.html(data.msg);
                   }else{
                       //不存在
                       span.css("color","green");
                       span.html(data.msg);
                   }
               }/*,"json"*/);
           });
       });
    </script>
</head>
<body>
      <input type="text" id="username" name="username" placeholder="请输入用户名">
      <span id="s_username"></span><br/>
      <input type="password" id="password" name="passowrd" placeholder="请输入密码"><br/>
      <input type="submit" value="提交">
</body>
</html>

使用ajax对用户注册时，用户名进行检验的更多相关文章

  1. 《ajax学习》之ajax+JavaScript事件验证用户名是否可注册

    当用户注册时,服务器数据库需要对用户输入的用户信息(以用户名为例子)进行验证,在不刷新页面的情况下又需要页面和服务器进行数据请求,最好的方法是用ajax异步请求. 一.实现思路: 1.用户输入信息 2 ...

  2. 织梦dedecms用户注册时笔名去掉的方法

    修改目的:用户注册时不用输入笔名,实现系统自动同步用户名和用户笔名. 负责织梦dedecms用户注册的php文件是member/reg_new.php ,不难发现,用户注册时的用户名$userid,和 ...

  3. WordPress新用户注册时提示“您的密码重设链接无效”

    在使用Wordpress密码找回功能及新用户注册邮件中的重置密码链接时,Wordpress提示“您的密码重设链接无效,请在下方请求新链接.”.“该key似乎无效”.“invalid key”. 这个其 ...

  4. ajax案例_校验用户名

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

  5. Ajax读取文件时出现的缓存问题

    对于Ajax缓存问题时,由于浏览器的版本问题,有时候当服务器端已更改文件中的内容,而客户端并得不到更新后的文件,而是延续之前的文件内容,解决办法是:在读取的文件内容后加一串的地址:JSON的格式为[{ ...

  6. jQuery打造用户注册时获取焦点文本框出现提示jquery表单特效

    jQuery打造用户注册时获取焦点文本框出现提示效果的jquery表单特效 当获取焦点时,会分别的弹出相应的信息提示框,失去焦点就会隐藏提示信息. 效果兼容性很高,适用浏览器:IE6.IE7.IE8. ...

  7. ajax传JSON时设置的contenttype导致JAVA中request.getParameter("")怎么也接收不到数据

    ajax传JSON时设置的contenttype默认值是application/x-www-form-urlencoded, 当ajax传JSON时设置的contenttype 如果是applicat ...

  8. 使用ajax请求数据时的几种做法

    在进行前后端交互的时候,一般前端使用ajax向后端发送数据,后端根据发送的数据来返回数据,前端将这些数据接收并进行相应的处理 以下是在日常工作中总结的几点使用ajax传递数据时的情况: 1.在本页面( ...

  9. TP框架中ajax post请求时提示404

    ajax post请求时提示404错误 TP框架中ajax post请求时提示404 找了半天是 控制器中方法有错误! 下次再遇到去控制器方法中找一步一步找,肯定能找到,我是单词拼错了!

随机推荐

  1. .NET Protobuf包装器库

    Wodsoft Protobuf Wrapper 内容 关于 需求 安装 用法 序列化 反序列化 字段定义 字段排序 非空构造函数对象 获取Protobuf包装器 高级 支持的属性类型与Protobu ...

  2. js 开始

    hello world 开始JavaScript 是一种脚本语言,它的解释器被称为 JavaScript 引擎.JavaScript 被发明用于在 HTML 网页上使用,给HTML网页增加动态功能.J ...

  3. laravel DB 类库

    DB 类操作数据库    基本用法: DB::table('tableName'); 获取操作tableName 表        增加信息        对数据库中的某个表增加数据主要有两个函数可以 ...

  4. [51nod1587]半现串

    将s所有长度为d/2的子串放进ac自动机中,直接匹配就可以判定半现串了再对其做一个差分,询问一个前缀的半现串个数,在ac自动机上数位dp,f[i][j][0/1]表示走了i步(i位的字符串),走到节点 ...

  5. idea文件多行显示

    将红色部分取消勾选

  6. 前端jsdebug调试

    前端如何像java一样的debug呢? 1.在js页面加入debugger next: function(){ debugger var type=this.quiz[this.progress].s ...

  7. python网络自动化运维之环境搭建（EVE-NG+pycharm）

    参考了很多资料,发现现在很多环境用的都是GNS3加linux下的python,几乎没有是用EVE-NG加上pycharm的教程,EVE的功能如此强大,存在的教程却较少,这里我出一篇教程供使用EVE作为 ...

  8. 数值最优化：一阶和二阶优化算法(Pytorch实现)

    1 最优化概论 (1) 最优化的目标 最优化问题指的是找出实数函数的极大值或极小值,该函数称为目标函数.由于定位\(f(x)\)的极大值与找出\(-f(x)\)的极小值等价,在推导计算方式时仅考虑最小 ...

  9. Git 使用，本地项目上传到GitHub远程库

    Git 使用,本地项目上传到GitHub远程库 环境 GitHub账号 点此进入github官网 git客户端工具 点此进入git下载页 本地项目上传到 GitHub 在GitHub中创建一个仓库(远 ...

  10. perl练习——FASTA格式文件中序列GC含量计算&perl数组排序如何获得下标或者键

    一.关于程序: FUN:计算FASTA文件中每条序列中G和C的含量百分比,输出最大值及其id INPUT:FASTA格式文件 >seq1 CGCCGAGCGCTTGACCTCCAGCAAGACG ...