XMLHttpRequest对象可以在不向服务器提交整个页面的情况下，实现局部更新网页。当页面全部加载完毕后，客户端通过该对象向服务器请求数据，服务器端接受数据并处理后，向客户端反馈数据。 XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问，包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步返回 Web 服务器的响应，并且能以文本或者一个 DOM 文档形式返回内容。尽管名为 XMLHttpRequest，它并不限于和 XML 文档一起使用：它可以接收任何形式的文本文档。XMLHttpRequest 对象是名为 AJAX 的 Web 应用程序架构的一项关键功能。

Jquery实现ajax比原生ajax要简单方便，减少冗余代码。不需要记住太多的属性，类型。操作简单。

ajax常用的属性有：URL （请求路径） Type(请求方式)   data（请求需要的数据）

页面代码:

<%--

  Created by IntelliJ IDEA.

  User: 秀清风

  Date: 2018/12/28

  Time: 12:18

  To change this template use File | Settings | File Templates.

--%>

<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>

<html>

<head>

    <title>Title</title>

</head>

<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>

<script type="text/javascript" >

    $(function  () {

        $("[name=uname]").blur(function () {

            $.ajax({

                url:"${pageContext.request.contextPath}/ajaxServlet",//目标路径

                type:"post",//请求格式

                data:"uname="+$("[name=uname]").val(),//请求的数据

                dataType:"text",//请求数据的类型

                success:function(data){

                   uname=$("[name=uname]").val();

                    if (data=="true"){

                        $("#msg").html("用户名已被注册");

                        $("#msg").css('color','red');

                    } else if(data=="false"&&uname!=""){

                        $("#msg").html("用户名可以使用");

                        $("#msg").css('color','green');

                    }else {

                        $("#msg").html("用户名不可为空");

                        $("#msg").css('color','red');

                    }

                }

            });

        });

    });

</script>

<body>

<form  method="post" >

    用户名：<input type="text" id="uname" name="uname" ><span id="msg"></span><br>

    密码： <input type="text" id="upwd" name="upwd">

</form>

</body>

</html>

servlet代码：

package cn.happy.Servlet;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import java.io.IOException;

public class AjaxServlet extends HttpServlet {

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

        String action=request.getParameter("uname");//获取到用户输入框

        System.out.println(action);

        if (action.equals("admin")){//输入框的值为admin,显示用户名已被注册

            response.getWriter().write("true");//使用响应的写入功能

        }else{

            response.getWriter().write("false");

        }

    }

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

        doPost(request,response);

    }

}

效果：

Jquery Ajax Realize whether the user is registered的更多相关文章

  1. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  2. jquery ajax解析

    jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对 ...

  3. jQuery.ajax 根据不同的Content-Type做出不同的响应

    使用H5+ASP.NET General Handler开发项目,使用ajax进行前后端的通讯.有一个场景需求是根据服务器返回的不同数据类型,前端进行不同的响应,这里记录下如何使用$.ajax实现该需 ...

  4. jQuery.ajax(url,[settings])

    概述 通过 HTTP 请求加载远程数据. jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象. ...

  5. jQuery Ajax 实例 ($.ajax、$.post、$.get)

    jQuery Ajax 实例 ($.ajax.$.post.$.get) 转 Jquery在异步提交方面封装的很好,直接用AJAX非常麻烦,Jquery大大简化了我们的操作,不用考虑浏览器的诧异了. ...

  6. jQuery Ajax传值给Servlet,在Servlet里Get接受参数乱码的解决方法

    最近在学jquery ui,在做一个小功能的时候需要将前台的值获取到,通过Ajax传递给Servlet,然后再在返回数据结果,但是在Servlet接受参数的时候,通过后台打印,发现接受乱码,代码示例如 ...

  7. JQuery+Ajax+Struts2+Hibernate 实现完整的登录注册

    写在最前: 下午有招聘会,不想去,总觉得没有准备好,而且都是一些不对口的公司,可是又静不下心来,就来写个博客. 最近在仿造一个书城的网站:http://www.yousuu.com ,UI直接拿来用, ...

  8. 用.NET MVC实现长轮询，与jQuery.AJAX即时双向通信

    两周前用长轮询做了一个Chat,并移植到了Azure,还写了篇博客http://www.cnblogs.com/indream/p/3187540.html,让大家帮忙测试. 首先感谢300位注册用户 ...

  9. jQuery AJAX 网页无刷新上传示例

    新年礼,提供简单.易套用的 jQuery AJAX 上传示例及代码下载.后台对文件的上传及检查,以 C#/.NET Handler 处理 (可视需要改写成 Java 或 PHP). 有时做一个网站项目 ...

随机推荐

  1. 加密流量分析cisco

    思科ETA主页 https://www.cisco.com/c/en/us/solutions/enterprise-networks/enterprise-network-security/eta. ...

  2. 《笨方法学Python》加分题20

    加分练习通读脚本,在每一行之前加注解,以理解脚本里发生的事情.每次 print_a_line 运行时,你都传递了一个叫 current_line 的变量,在每次调用时,打印出 current_line ...

  3. Django学习笔记（进阶篇）

    Django学习笔记(进阶篇):http://www.cnblogs.com/wupeiqi/articles/5246483.html

  4. PHP不借助第三个变量交换值

    总结一下: //方法一: $a = "abc"; $b= "def"; $a = $a^$b; $b = $b^$a; $a = $a^$b; //方法二: l ...

  5. EXCEL公式及宏

    VLOOKUP特别好用的一个用于映射的公式 1.需要根据ID找到对应的NAME 2.将可以用于映射的两列放到G,H列中(注意!用于检索的要放在相对的第一列中) 3.VLOOKUP(A2,G:H,2,F ...

  6. Spring 缓存注解之@Cacheable,@CacheEvit

    Spring引入了Cache的支持,其使用方法类似于Spring对事务的支持.Spring Cache是作用于方法上的,其核心思想是,当我们调用一个缓存方法时,把该方法参数和返回结果作为一个键值对存放 ...

  7. Golang之路【目录】

    我正在写一套使用Golang全栈开发的教程,名字暂叫“Golang之路”,希望大家多提建议. 目录如下: Golang之路[第一篇]:Golang简介和入门Golang之路[第二篇]:Golang基础 ...

  8. Linux任务计划命令 :crontab -e

    crond是linux下用来周期性的执行某种任务或等待处理某些事件的一个守护进程,与windows下的计划任务类似,当安装完成操作系统后,默认会安装此服务工具,并且会自动启动crond进程,crond ...

  9. pip install cv2报错

    pip install cv2 安装cv2报错: Could not find a version that satisfies the requirement cv2 (from versions: ...

  10. 把excel每一行中的数据输出为一个txt文档的VBA函数

    excel vba代码: Sub makeTxt() For i = 1 To 1088'从第1行到1088行(最后一行) On Error Resume Next'出现错误时继续运行脚本 Open ...