<%@ 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. MVC中使用JQuery方式进行异步请求和使用自带方式进行异步请求

    在MCV中使用异步请求可以很很高效地进行前台和后台的数据传递,在这里,笔者为初学者介绍两种在MVC中常用的异步请求处理方式. 在这里,我们通过在一个页面中放置一个按钮来异步获取当前服务器端的系统时间为 ...

  3. [js开源组件开发]network异步请求ajax的扩展

    network异步请求ajax的扩展 在日常的应用中,你可能直接调用$.ajax是会有些问题的,比如说用户的重复点击,比如说我只希望它成功提交一次后就不能再提交,比如说我希望有个正在提交的loadin ...

  4. js:如何在循环异步请求的每次返回中添加想要的值

    先看一个场景 var arr = ["a","b","c"]; for (var i in arr) {         $.get(&qu ...

  5. 原生JS代码实现一个Ajax异步请求

    异步加载的方式 (1) defer,只支持IE (2) async: (3) 创建script,插入到DOM中,加载完毕后callBack 实现ajax之前必须要创建一个 XMLHttpRequest ...

  6. jQuery基础(Ajax,load(),getJSON(),getScript(),post(),ajax(),同步/异步请求数据)

    1.使用load()方法异步请求数据   使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为:   load(url,[data],[callba ...

  7. jquery ajax异步请求

    得先知道后台接口给ajax访问(接口URl和传入接口的参数及参数类型),知道访问之后返回的数据类型,有哪些数据.   选择异步请求的方式,常用的有三种,如$.ajax().$.post().$.get ...

  8. SpringBoot中异步请求和异步调用(看这一篇就够了)

    原创不易,如需转载,请注明出处https://www.cnblogs.com/baixianlong/p/10661591.html,否则将追究法律责任!!! 一.SpringBoot中异步请求的使用 ...

  9. SpringBoot异步请求

    何为异步请求 在Servlet 3.0之前,Servlet采用Thread-Per-Request的方式处理请求,即每一次Http请求都由某一个线程从头到尾负责处理.如果一个请求需要进行IO操作,比如 ...

随机推荐

  1. ASP.NET+d3.js实现Sqlserver数据库的可视化展示

    效果: 数据库端: 前端展示: 实现原理: 1.在数据段建立两个存储过程 queryUserAnsawer(id) 根据用户ID返回每一题的得分,主要是bcp exe时不能直接在sqlserver中执 ...

  2. 转载 全角字符unicode码对应表

    http://www.mytju.com/classcode/tools/encode_utf8.asp 对应关系查询网站 Uni. GB Uni. GB Uni. GB Uni. GB Uni. G ...

  3. Python—执行系统命令的四种方法

    一.os.system方法 这个方法是直接调用标准C的system() 函数,仅仅在一个子终端运行系统命令,而不能获取命令执行后的返回信息. os.system(cmd)的返回值.如果执行成功,那么会 ...

  4. MySQL数据库~~~~初识、基础数据类型

    一 数据库初识 1.1 什么是数据库 数据库(DataBase,简称DB),简而言之可视为电子化的文件柜----存储电子文件的处所,用户可以对文件中的数据运行新增,截取,更新,删除等操作. 所谓数据库 ...

  5. everspin自旋转矩MRAM技术

    MRAM的主体结构由三层结构的MTJ构成:自由层(free layer),固定层和氧化层.自由层与固定层的材料分别是CoFeB和MgO.MRAM 是一种非易失性的磁性随机存储器.它拥有静态随机存储器( ...

  6. .NET Core 3.0正式版发布

    是的,.NET Core 3.0正式版发布了,令人兴奋. WPF 其实,.NET Core 2.1开始已经是个很完善的版本,3.0又带来了什么呢?我站在我的使用角度来看,最最令人振奋的就是:能用WPF ...

  7. 群晖NAS再再折腾

    问题 最近电信把我的公网地址收回去了,之前做好的网络端口映射失效了,在公司已经不能愉快地访问家里的网络.原先网络结构示意图如下: (直接访问方案网络结构图)   只需要对电信光猫(也是个路由器)和家用 ...

  8. 【数据库】SQLite3常用命令

    版权声明:本文为博主原创文章,转载请注明出处. https://www.cnblogs.com/YaoYing/ 打开SQLite3文件 sqlite3 student.db //打开student. ...

  9. react中报错Failed to set an indexed property on 'CSSStyleDeclaration': Index property setter is not supported

    产生这个报错的原因是我当时将样式写到了less文件,我在div中使用的使用应该是使用className = ,而我误写了一个style = .style里面当然没有自定义的className,所以产生 ...

  10. 深入浅出 PHP SPL(PHP 标准库)(转)

    一.什么是spl库? SPL是用于解决典型问题(standard problems)的一组接口与类的集合. 此扩展只能在php 5.0以后使用,从PHP 5.3.0 不再被关闭,会一直有效.成为php ...