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. .net webapi 接收 xml 格式数据的三种情况

    webapi 接收 xml 的三种方法 前段时间接到一个任务写一个小接口,要接收java端返回过来的短信xml数据. 刚拿到项目,我的第一想法是对方会以什么形式发送xml格式的数据给我呢,设想三种情况 ...

  2. Servlet获取 URL 地址

    使用 ServletRequest 的如下方法 getContextPath 取得项目名 getServletPath 取得Servlet名 getPathInfo 取得Servlet后的URL名,不 ...

  3. 七、PyQT5控件——QSlider，QSpinBox

    一.Qslider QSlider是一个滑动条,可以设置成水平或垂直放置.最常用的方法允许用户在某一范围内互动该滑块,并将滑块的位置转换成一个整数值(int类型),这种方式可以在某一个范围内平顺的变动 ...

  4. 导入别人的项目eclipse 出现乱码 该如何处理

  5. clouderamanager安装

    下载地址 http://archive.cloudera.com/cm5/cm/5/ 安装 先安装manager,再安装cdh 待续

  6. About certificate

    证书spec, X509, 类似规定了一个目录结构.其中重要内容包括 issuer: who isued this certificate subject: the ID of this certif ...

  7. 如何安装ubuntu系统

    https://www.cnblogs.com/Chinasf/archive/2010/05/06/1728840.html    [Ubuntu 下挂ISO到虚拟光驱的方法] 各种方法参考如下论坛 ...

  8. Unity编辑器扩展-Custom List, displaying data your way

    本文转自http://catlikecoding.com/unity/tutorials/editor/custom-list/ Custom List, displaying data your w ...

  9. Day08 (黑客成长日记) 命名空间和作用域

    Day08:命名空间和作用域: 1.命名空间: (1)内置命名空间(python解释器): 就是python解释器一旦启动就可以使用的名字储存在内置命名空间中: eg: len() print() a ...

  10. Sql Server常用数据库函数小结

    查询验证存储过程是否存在 SELECT name FROM sysobjects WHERE  xtype = 'P' and name = '{0}' ----------------------- ...