14.javaweb AJAX技术详解
一、简介
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技术详解的更多相关文章
- Ajax技术详解
Ajax技术:Ajax描述了一种主要使用脚本(JS)操纵HTTP的web应用架构,它的主要特点是使用脚本操纵HTTP和web服务器进行数据交换,不会导致页面重载.Ajax的核心是JS的XMLHttpR ...
- $.ajax()常用方法详解(推荐)
AJAX 是一种与服务器交换数据的技术,可以在补充在整个页面的情况下更新网页的一部分.接下来通过本文给大家介绍ajax一些常用方法,大家有需要可以一起学习. 1.url: 要求为String类型的参数 ...
- 触碰jQuery:AJAX异步详解
触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...
- jQuery调用AJAX异步详解[转]
AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1) 使用CSS和X ...
- 触碰jQuery:AJAX异步详解(转)
AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1) 使用CSS和X ...
- AJAX请求详解 同步异步 GET和POST
AJAX请求详解 同步异步 GET和POST 上一篇博文(http://www.cnblogs.com/mengdd/p/4191941.html)介绍了AJAX的概念和基本使用,附有一个小例子,下面 ...
- Comet技术详解:基于HTTP长连接的Web端实时通信技术
前言 一般来说,Web端即时通讯技术因受限于浏览器的设计限制,一直以来实现起来并不容易,主流的Web端即时通讯方案大致有4种:传统Ajax短轮询.Comet技术.WebSocket技术.SSE(Ser ...
- SSE技术详解:一种全新的HTML5服务器推送事件技术
前言 一般来说,Web端即时通讯技术因受限于浏览器的设计限制,一直以来实现起来并不容易,主流的Web端即时通讯方案大致有4种:传统Ajax短轮询.Comet技术.WebSocket技术.SSE(Ser ...
- Protocol Buffer技术详解(Java实例)
Protocol Buffer技术详解(Java实例) 该篇Blog和上一篇(C++实例)基本相同,只是面向于我们团队中的Java工程师,毕竟我们项目的前端部分是基于Android开发的,而且我们研发 ...
随机推荐
- ADALINE模型
ADALINE模型即自适应线性单元(Adaptive Linear Neuron),主要用于信号处理中的自适应滤波.预测和模式识别.其结构图如下 输入向量X=(x0,x1,x2,...,xn)T每个输 ...
- Chinese Rings hdu 2842 矩阵快速幂
Chinese Rings Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Tot ...
- Python文件复制(txt文件)
功能:这个py脚本是把一个txt文件(源文件)复制到另一个txt文件(目的文件)里面 算法思路: 程序首先判断源文件(用exists函数判断)和目的文件是否存在,如果不存在则输出文件路径不存在,如果存 ...
- LeetCode-2 Keys Keyboard
package Classify.DP.Medium; import org.junit.jupiter.api.Test; /** Initially on a notepad only one c ...
- HDU1403Longest Common Substring
明天写 超时代码: #include<cstdio> #include<cstdlib> #include<iostream> #include<cstrin ...
- Echarts图表统计学习
史上最全的Echarts图表学习文档 http://echarts.baidu.com/doc/doc.html 勤加练习,多做总结! http://www.stepday.com/topic/?79 ...
- 第二章 MySQL入门篇
第一章 MySQL入门篇 一.MySql简介 简言: 和SQL Server数据库相同,MySQl也是一个关系型数据库管理系统.由瑞典的MySQL AB公司开发,2008年被SUN公司收购,2009年 ...
- 【特效】手机端仿美团下拉菜单带遮罩层html+css+jquery
写了一个手机端的下拉菜单,类似美团,用相对单位rem写的. 效果截图: 代码很简单,原理有点类似嵌套的选项卡,其中的难点在于弹出下拉菜单后,出现黑色半透明遮罩层,而且下层列表页面禁止滚动了.关键就是给 ...
- JavaScript设计模式--门面模式
外部与一个子系统的通信必须通过一个系统的一个门面对象进行,这就是门面模式. 门面模式具备如下两个角色: 1. 门面角色 客户端可以调用这个角色方法,此角色中有子系统的应用(知晓相关的(一个或多个)子系 ...
- ABAP字符串的加密与解密
FIEB_PASSWORD_DECRYPT:字符串解密:FIEB_PASSWORD_ENCRYPT:字符串加密.旧版本的可以用. PARAMETERS:str1 type char32 OBLIGAT ...