一、简介

1,  ajax:在不重新加载网页的前提下,与服务器交换数据并更新部分网页的技巧,但其本身并不是一种新技术

2,  核心:XMLHttpRequest对象。AJAX技术主要是通过此对象完成的。

在创建此对象的时候一定要考虑浏览器的问题

XMLHttpRequest对象的创建

XMLHttpRequest对象属性

其中readyState有五种取值

XMLHttpRequest对象方法

3,  简单示例:利用ajax完成局部刷新功能:局部刷新,在<span>中导入content.html内容

content.html内容

Flush.html

xmlHttp.onreadystatechange=showMsgCallback;表示当xmlHttp的请求状态改变时,就会调用showMsgCallback()方法,事实上,当xmlHttp.send()发送请求到响应完成,readyState会经历”2“(请求正在处理)、”3”(请求已经处理)、”4“(响应完成)三次变化,如果回调函数在xmlHttp.send()之前设置,便会调用三次showMsgCallback()方法。我们设置readyState=4时执行操作,因为此时响应完成,服务器会把回应内容填充到xmlHttp.response***属性中

点击“调用ajax显示内容”则会动态的在<span>中生成”取得数据”

二、ajax异步验证:当新用户注册信息时,输入ID后,异步验证ID是否可用

login.html

注意此处用到的地址重写的方式

Checkservlet

package com.chen.ying;

import java.io.PrintWriter;

import java.sql.Connection;

import java.sql.DriverManager;

import java.sql.PreparedStatement;

import java.sql.ResultSet;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class CheckId extends HttpServlet {

    final String DBDIVRE="com.mysql.jdbc.Driver";

    final String URL="jdbc:mysql://localhost:3306/test";

    final String USER="root";

    final String PASSWORD="1995228";

     Connection conn=null;

    PreparedStatement pstmt=null;

    ResultSet rs=null;

    public void doGet(HttpServletRequest req,HttpServletResponse res){

        int  userid=Integer.parseInt(req.getParameter("userid"));

        try{

            System.out.println(userid);

            PrintWriter out=res.getWriter();//得到回应的输出流

            Class.forName(DBDIVRE);

            conn=DriverManager.getConnection(URL,USER,PASSWORD);

            String sql="select userid from person where userid=?";

            pstmt=conn.prepareStatement(sql);

            pstmt.setInt(1, userid);

            rs=pstmt.executeQuery();

            if(rs.next()){

                System.out.println("用户ID重复");

                out.print("true");

            }

            else{

                System.out.println("ID可用");

                out.print("false");

            }

        }catch(Exception e){

            System.out.println(e);

        }  

        }

    public void doPost(HttpServletRequest req,HttpServletResponse res){

        this.doGet(req, res);

    }

}

效果

当用户输入id,光标离开输出框后,利用ajax技术,异步验证输入的id是否重复

三、返回XML数据

1,  要求

14.javaweb AJAX技术详解的更多相关文章

  1. Ajax技术详解

    Ajax技术:Ajax描述了一种主要使用脚本(JS)操纵HTTP的web应用架构,它的主要特点是使用脚本操纵HTTP和web服务器进行数据交换,不会导致页面重载.Ajax的核心是JS的XMLHttpR ...

  2. $.ajax()常用方法详解(推荐)

    AJAX 是一种与服务器交换数据的技术,可以在补充在整个页面的情况下更新网页的一部分.接下来通过本文给大家介绍ajax一些常用方法,大家有需要可以一起学习. 1.url: 要求为String类型的参数 ...

  3. 触碰jQuery:AJAX异步详解

    触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...

  4. jQuery调用AJAX异步详解[转]

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  5. 触碰jQuery:AJAX异步详解(转)

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  6. AJAX请求详解 同步异步 GET和POST

    AJAX请求详解 同步异步 GET和POST 上一篇博文(http://www.cnblogs.com/mengdd/p/4191941.html)介绍了AJAX的概念和基本使用,附有一个小例子,下面 ...

  7. Comet技术详解:基于HTTP长连接的Web端实时通信技术

    前言 一般来说,Web端即时通讯技术因受限于浏览器的设计限制,一直以来实现起来并不容易,主流的Web端即时通讯方案大致有4种:传统Ajax短轮询.Comet技术.WebSocket技术.SSE(Ser ...

  8. SSE技术详解:一种全新的HTML5服务器推送事件技术

    前言 一般来说,Web端即时通讯技术因受限于浏览器的设计限制,一直以来实现起来并不容易,主流的Web端即时通讯方案大致有4种:传统Ajax短轮询.Comet技术.WebSocket技术.SSE(Ser ...

  9. Protocol Buffer技术详解(Java实例)

    Protocol Buffer技术详解(Java实例) 该篇Blog和上一篇(C++实例)基本相同,只是面向于我们团队中的Java工程师,毕竟我们项目的前端部分是基于Android开发的,而且我们研发 ...

随机推荐

  1. Django的form表单之文件上传

    在生成input标签的时候可以指定input标签的类型为file类型 <!DOCTYPE html> <html lang="en"> <head&g ...

  2. Python多线程练习(threading)

    这几天学习python多线程的时候,试了几次thread模块和threading模块,发现thread模块非常的不好用.强烈不建议大家使用thread,建议使用threading模块,此模块对thre ...

  3. Python操作excel表格

    用Python操作Excel在工作中还是挺常用的,因为毕竟不懂Excel是一个用户庞大的数据管理软件 注:本篇代码在Python3环境下运行 首先导入两个模块xlrd和xlwt,xlrd用来读取Exc ...

  4. asp.net或javascript判断是否手机访问

    /// <summary> /// 判断手机用户UserAgent /// </summary> /// <returns></returns> pri ...

  5. Color Blender---在线渐变色带生成器

       Color Blender是一个很有用的在线渐变色带生成器,它可以在两种颜色之间,自动生成过渡色,对网页设计师来说是一个不错的颜色调配工具.   Color Blender的使用方法很简单,你只 ...

  6. Js全选 添加和单独删除

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. ABAP 选择屏幕创建标签页

    *&---------------------------------------------------------------------* *& Report ZTEST_TAB ...

  8. 如何从MVP模式进阶到Clean模式

    从类图上来看,MVP都是一个业务一个Presenter,每个Presenter都是一个接口,它还包含了View的接口,用于定于和View相关的行为,然后Activity等业务类实现View的接口,因为 ...

  9. OpenSCAD 建模:相框

    下载地址:https://github.com/ZhangGaoxing/openscad-models/tree/master/PhotoFrame 代码: module bottom(){ dif ...

  10. 张高兴的 Windows 10 IoT 开发笔记:ADXL345 加速度传感器

    GitHub : https://github.com/ZhangGaoxing/windows-iot-demo/tree/master/ADXL345Demo