<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>ajax</title>
    <script src="/ajax/js/jquery-3.3.1.min.js"></script>
  </head>
  <body>
  <form action="http://www.ubfgho.com/" method="post" enctype="application/x-www-form-urlencoded">
    姓名：<input type="text" name="name"><span></span><br>
    密码：<input type="password" name="psw"><br>
    <input type="submit" value="提交"><br>
  </form>
  </body>
  <script>
      //js实现post方式的异步请求
      $(':text').blur(function () {
          var name1=$(this).val().trim()
          //1、创建发送异步请求的对象req
          var req=XMLHttpRequest();
          //2、准备发送
          req.open("POST","ajax/login",true)
          //3、设置请求头
          req.setRequestHeader("Content-type","application/x-www-form-urlencoded")
          //4、发送
          req.send("name"+name1)

          //回调参数
          req.onreadystatechange=function () {
              if (req.readyState==4&&req.status==200){
                  $("span").html(req.responseText).css("color","red")
              }
          }
      })

    //1、失去焦点事件--判断姓名是否为空
    $(':text').blur(function () {
        var v=$(this).val()
        if (v.trim()==""){
            $("span").html("姓名为空").css("color","red")
        }else{
            $("span").html("")//清空span
        }
    })
    //2、提交事件---点击提交按钮触发submit
    $("form").submit(function () {
        //选中text文本
        var v=$(':text').val().trim();
        if (v==""){
        //如果姓名为空。就返回false，阻止提交，
            return false
        }
    })

  </script>
</html>

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

    String name=request.getParameter("name");
    boolean b=dao.selectName(name);
    String msg=b?"用户名已被占用":"用户名正常";
    response.setContentType("text/html;charset=UTF-8");
    response.getWriter().write(msg);
}
												


											
js实现post方式的异步请求的更多相关文章
	

    
								
  1. Ajax:实现后台验证js实现get方式的异步请求，判断用户名是否重复
		
    <%@ page contentType="text/html;charset=UTF-8" language="java" %><html& ...
    
		
    2. 
						
  2. MVC中使用JQuery方式进行异步请求和使用自带方式进行异步请求
		
    在MCV中使用异步请求可以很很高效地进行前台和后台的数据传递,在这里,笔者为初学者介绍两种在MVC中常用的异步请求处理方式. 在这里,我们通过在一个页面中放置一个按钮来异步获取当前服务器端的系统时间为 ...
    
		
    3. 
						
  3. [js开源组件开发]network异步请求ajax的扩展
		
    network异步请求ajax的扩展 在日常的应用中,你可能直接调用$.ajax是会有些问题的,比如说用户的重复点击,比如说我只希望它成功提交一次后就不能再提交,比如说我希望有个正在提交的loadin ...
    
		
    4. 
						
  4. js：如何在循环异步请求的每次返回中添加想要的值
		
    先看一个场景 var arr = ["a","b","c"]; for (var i in arr) {         $.get(&qu ...
    
		
    5. 
						
  5. 原生JS代码实现一个Ajax异步请求
		
    异步加载的方式 (1) defer,只支持IE (2) async: (3) 创建script,插入到DOM中,加载完毕后callBack 实现ajax之前必须要创建一个 XMLHttpRequest ...
    
		
    6. 
						
  6. jQuery基础（Ajax，load()，getJSON()，getScript()，post()，ajax()，同步/异步请求数据）
		
    1.使用load()方法异步请求数据   使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为:   load(url,[data],[callba ...
    
		
    7. 
						
  7. jquery ajax异步请求
		
    得先知道后台接口给ajax访问(接口URl和传入接口的参数及参数类型),知道访问之后返回的数据类型,有哪些数据.   选择异步请求的方式,常用的有三种,如$.ajax().$.post().$.get ...
    
		
    8. 
						
  8. SpringBoot中异步请求和异步调用（看这一篇就够了）
		
    原创不易,如需转载,请注明出处https://www.cnblogs.com/baixianlong/p/10661591.html,否则将追究法律责任!!! 一.SpringBoot中异步请求的使用 ...
    
		
    9. 
						
  9. SpringBoot异步请求
		
    何为异步请求 在Servlet 3.0之前,Servlet采用Thread-Per-Request的方式处理请求,即每一次Http请求都由某一个线程从头到尾负责处理.如果一个请求需要进行IO操作,比如 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 魔术师发牌问题 -- python实现
			
    问题描述 魔术师手中有A.2.3--J.Q.K十三张黑桃扑克牌.在表演魔术前,魔术师已经将他们按照一定的顺序叠放好(有花色的一面朝下).魔术表演过程为:一开始,魔术师数1,然后把最上面的那张牌翻过来, ...
    
			
    2. 
						
  2. python基础之字符串讲解（上）
			
    字符串 字符串是 Python 中最常用的数据类型.我们可以使用引号('或者")来创建字符串. 创建字符串很简单,只要为变量分配一个值即可.For example: 为str输入一个变量,p ...
    
			
    3. 
						
  3. linux 动态链接库查找方法；查找动态链接库位置; LIBRARY_PATH 和 LD_LIBRARY_PATH 的区别；LD_LIBRARY_PATH and LD_RUN_PATH的区别；
			
    今天配置之前项目的时候,发现有些动态链接库变了,想看看现在应用在使用哪些动态链接库的时候,进一步查了点资料: 下面针对linux动态链接库查找方法和动态链接库位置配置的过程进行记录: LIBRARY_ ...
    
			
    4. 
						
  4. AVProVideo 在android 真机使用经验分享
			
    AVProVideo 在 android 方面 如果想使用必须进行合理的设置:如图 发布的时候设置: 如果想使用代码替换播放视频: 第一步:设置  PlatformOptionsAndroid.ove ...
    
			
    5. 
						
  5. Linux 终端(TTY)
			
    TTY 是 Teletype 或 Teletypewriter 的缩写,原来是指电传打字机,后来这种设备逐渐键盘和显示器取代.不管是电传打字机还是键盘显示器,都是作为计算机的终端设备存在的,所以 TT ...
    
			
    6. 
						
  6. Comet OJ - Contest #11    B题  usiness
			
    ###题目链接### 题目大意:一开始手上有 0 个节点,有 n 天抉择,m 种方案,在每天中可以选择任意种方案.任意次地花费 x 个节点(手上的节点数不能为负),使得在 n 天结束后,获得 y 个节 ...
    
			
    7. 
						
  7. Docker + WordPress搭建个人博客
			
    WordPress是目前非常受欢迎的开源博客系统,今天使用Docker + WordPress搭建个人博客,整个过程非常丝滑. 搭博客先要准备域名和服务器,昨天在阿里云买了个.top的域名花了5块钱( ...
    
			
    8. 
						
  8. ASP.NET Core 2.x 到 3.1 迁移指南
			
    一.前言 今日(2019/12/4).NET Core 3.1 正式发布了,ASP.NET Core 3.1 随之发布,这次 3.0 到 3.1经过了两个月的短周期,并没有增加重大的功能,主要是对 3 ...
    
			
    9. 
						
  9. PlayJava Day023
			
    进程:进程是程序的一次动态执行过程,它经历了从代码加载.执行到执行完毕的一个完整过程,这个过程也是进程本身从产生.到发展到最终消亡的过程 多进程:多进程操作系统能同时运行多个进程(程序) 多线程:是指 ...
    
			
    10. 
						
  10. Angular--AOT和JIT两种编译方式带来的改变
			
    Angular 应用主要由组件及其 HTML 模板组成.由于浏览器无法直接理解 Angular 所提供的组件和模板,因此 Angular 应用程序需要先进行编译才能在浏览器中运行.Angular 提供 ...
    
			
    11.