使用Ajax和jQuery实现异步请求

说明：

无论是传统的web开发技术还是Ajax技术，都由客户端发送HTTP请求，然后由服务器对请求生成响应。但两者之间还是存在以下不同点。

(1)  发送请求的方式不同

       传统方式的web应用请求是通过浏览器发送的同步请求，而Ajax技术是通过JavaScript的XMLHttpRequest对象发送异步请求的。

(2)   服务器响应内容不同。

        针对传统应用方式的web请求，服务器的响应是一个完整的页面，而采用Ajax后服务器的响应只需包含页面局部更新的数据。

(3)   客户端处理响应的方式不同

        浏览器以传统方式发送请求后，将等待服务器响应完成并重新加载整个页面，而采用Ajax技术后，浏览器无需再空闲等待响应，只需使用JavaScript动态修改页面中需要更新的部分。

Ajax技术的工作流程

Ajax核心——XMLHttpRequest对象

 XMLHttpRequest对象是Ajax技术的核心，用于与服务器进行交互。它可以在不刷新当前页面的情况下向服务器上特定的URL异步发送请求、获取数据，从而在当前页面中实现局部更新的效果。

1.XMLHttpRequest对象的创建

语法：

xmlHttpRequest=new XMLHttpRequest();
//在老版IE中，语法格式如下。
xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");

使用Ajax技术发送请求

首先看一下原生态发送请求的方法：

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

  
    
  
  
  

    
  
  
  

再看看Servlet里面怎么写

package Servlet;

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.io.PrintWriter;

@WebServlet("/Do_uname")
public class Do_uname extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.setCharacterEncoding("UTF-8");
        resp.setContentType("text/html;charset=UTF-8");
        PrintWriter out=resp.getWriter();
        //接受同步  异步 方法都是一样的
        String uname=req.getParameter("uname").trim();
//        System.out.print(uname+"~~~~~~~~~~~");
        //你得去数据库判断   获取结果：有还是没有
        if("admin".equals(uname)){
            //如何返回这个结果   TRUE  FALSE
            //用流   输出的方式给前台
            out.print("false");
        }else{
            out.print("true");
        }
    }

    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doPost(req, resp);
    }
}

实体类我就不放了，都会写

 接下来就是简单的jQuery简化Ajax的实现：

是不是简单许多？

对于更多复杂的应用而言，使用Ajax仅仅从服务器中获取一些简单的文本是远远不够的。在Ajax出现之初，客户端和服务器端之间传递数据使用的是XML，但xml数据量比较大，解析也比较复杂。当JSON出现时，其轻量级和易于解析的优点，收到业界关注，成为理想的数据交换语言。

简单来说，JSON是一种对象表示方法，能够以文本形式存储和传递信息。

JSON语法：

var JSON对象={name:value,name:value,......};

在名/值对中，name必须是字符串，由双引号引起来，value可以是String、number、boolean、null、对象、数组。

。。。。。。