javascript-XMLHttpRequest
JS方法:
var xmlhttp;//一定注意是写在外面的全局变量,我调了一个上午才发现。 function verify(){
//使用dom方式获取文本框中的值
var userName=document.getElementById("userName").value;
//以下5个步骤即完成ajax应用的5个关键步骤
//1. 创建XMLHttpRequest对象(最关键&复杂的一步)
//需要针对IE和其他类型的浏览器建立这个对象的不同方式写不同代码
if(window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();//针对mozillar,firefox,opera,safari,ie7,ie8
//针对某些特定版本的mozillar浏览器的bug(主要是调用回调函数时会有问题)进行修正(这一步是保证脚本的健壮性)
if(xmlhttp.overrideMimeType){
xmlhttp.overrideMimeType("text/xml");
}
}else if(window.ActionXObject){
//(老师语)为什么这个放在第二个if语句里呢?
//(1)针对的对象范围太窄
//(2)自身的缺陷或者说原理已被一些人摸透了,有人利用ActionXObject干了不少坏事(?)所以会被一些有经验的用户直接禁掉
//针对ie6,ie5.5,ie5
//两个可以创建XMLHttpRequest对象的控件名称,保存在一个js数组中,排在前面的较新
varactivexName=["MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
for(var i=0; i<activexName.length; i++){
try{
xmlhttp=new ActionXObject(activexName[i]);
break;
}catch(e){
}
} }
//确认XMLHttpRequest对象创建成功(保证脚本的完整性,指开发的时候)
if(!xmlhttp){
alert("XMLHttpRequest对象创建视频!!");
return;
}else{
alert(xmlhttp);
}
//2. 注册回调函数
//只用函数名,不加括号,是因为该句只是把回调函数名注册给xmlhttp.onreadystatechange
//如果加了括号,则是调用函数,然后把该函数的返回值注册了。
//xmlhttp状态每次改变都会重新调用callback方法
xmlhttp.onreadystatechange=callback;
//3. 利用open方法设置与服务器的连接信息
xmlhttp.open("GET","AjaxServer?name="+userName,true);//Post方法请自行google百度
//还可以用Post方法进行传送,//xmlhttp.open(“POST”,”AjaxServer”,true)
//xmlhttp.setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”)
//4. 发送数据,开始和服务端进行交互
//之所以send(null)是因为第3步中,数据信息都在url里了,如果是Post方法,send(具体数据)
//如xmlhttp.send(“name”+userName);
//第3步中最后一个参数如果false,则运行到该句中止,一直等到数据返回;为true则代码继续运行
xmlhttp.send(null);
}
function callback(){
//5. 接收响应数据(在回调函数中针对不同响应状态进行处理)
//判断对象的状态是交互完成的
if(xmlhttp.readyState==4){
//0=未初始化,对象以创建,未调用open
//1=open方法调用成功,send方法未调用
//2=send方法已调用,未开始接收数据
//3=正在接收数据,HTTP响应头信息已经接收,数据尚未接收完成
//4=完成
//判断http的交互是否成功
if(xmlhttp.status==200){//关于xmlhttp.status请自行google百度
//获取服务器端返回数据
varresponseText=xmlhttp.responseText; //纯文本方式,关于其他方式请自行google百度
//将数据显示在页面上
//(1)通过Dom方式找到div标签对应的元素节点
vardivNode=document.getElementById("result");
//(2)设置元素节点中的html内容
divfNode.innerHTML=responseText;
}else{//出错信息}
}
} //这里有一个问题 就是 xmlhttp.open("GET","AjaxServer?name="+userName,true); 中的 AjaxServer 对于IE来说
//有些问题,交不到 想要的Servlet中去时,可以在后面加 ?type=nihao 什么的
//例:xmlhttp.open("GET","/myBoKe/PingLunController",true); 这个不能到PingLunController.java中,调到了主要的servlet中去了。 可能是我用了Iframe标签的 应该注意一下
// xmlhttp.open("GET","/myBoKe/PingLunController?type=in hao",true); 这样就可以了,很奇怪的
javascript-XMLHttpRequest的更多相关文章
- How to get blob data using javascript XmlHttpRequest by sync
Tested: Firefox 33+ OK Chrome 38+ OK IE 6 -- IE 10 Failed Thanks to 阮一峰's blog: http://www.ruanyifen ...
- javascript XMLHttpRequest对象全面剖析
转载:http://www.jb51.net/article/23175.htm 一. 引言 异步JavaScript与XML(AJAX)是一个专用术语,用于实现在客户端脚本与服务器之间的数据交互过程 ...
- [javascript]XMLHttpRequest GET/SET HTTP头与改变HTTP METHOD示例代码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- JavaScript——XMLHttpRequest 家族
https://www.zhangxinxu.com/wordpress/2013/10/understand-domstring-document-formdata-blob-file-arrayb ...
- [JavaScript] XMLHttpRequest记录
XMLHttpRequest 使用 XMLHttpRequest 对象可以和服务器进行交互,可以获取到数据,而无需让整个页面进行刷新.这样 web 页面可以做到只更新局部页面,降低了对用户操作的影响. ...
- [Javascript]XMLHttpRequest对象实现下载进度条
摘要 可以通过设置一个XMLHttpRequest对象的responseType属性来改变一个从服务器上返回的响应的数据类型.可用的属性值为空字符串 (默认), "arraybuffer&q ...
- javascript XMLHttpRequest 对象的open() 方法参数说明
下文是从w3c上摘录下来的,其中参数 method 说明的很简短,不是很理解,所以又找了些资料作为补充.文中带括号部分. XMLHttpRequest.open() 初始化 HTTP 请求参数 语法o ...
- javascript AJAX简单原理及什么是ajax
AJAX简单原理供初学者理解 AJAX的原理: Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面.这其 ...
- 06XML JavaScript
1. XML JavaScript XMLHttpRequest 对象 XML DOM (XML Document Object Model) 定义了访问和操作 XML 文档的标准方法.
- comp.lang.javascript FAQ [zz]
comp.lang.javascript FAQ Version 32.2, Updated 2010-10-08, by Garrett Smith FAQ Notes 1 Meta-FAQ met ...
随机推荐
- [转]轻松学习Ionic (四) 修改应用图标及添加启动画面(更新官方命令行工具自动生成)
本文转自:http://blog.csdn.net/zapzqc/article/details/42237935 由于Ionic更新了命令行工具,以后修改应用图标和添加启动画面就简单了,最新方法见最 ...
- 迷你DVD管理器项目
package chapter5; import java.util.*; public class MiniDVD { public static void main(String[] args){ ...
- 事故记录-过多进程致使CPU卡死
早上到公司,发现邮箱内有报警信息显示CPU和IO使用都已超标.报警内容如下:主机: test-server-192.168.1.18 时间: 2015.11.15 15:25:17状态: PROBLE ...
- javascript中的迭代器
1.forEach迭代器 forEach方法接收一个函数作为参数,对数组中每个元素使用这个函数,只调用这个函数,数组本身没有任何变化 //forEach迭代器 function square(num) ...
- mac终端命令大全介绍
OSX 的文件系统 OSX 采用的Unix文件系统,所有文件都挂在跟目录 / 下面,所以不在要有Windows 下的盘符概念. 你在桌面上看到的硬盘都挂在 /Volumes 下. 比如接上个叫做 US ...
- 神奇的GO语言:空接口(interface)
对于go语言来说,设计最精妙的应该是interface了,直白点说interface是一组method的组合.至于更加详细的描述,本文不做介绍,今天谈谈空接口. 空interface(interfac ...
- 入门Linux
45分钟带你入门Linux(附:笔者在工作室开讨论班录制的视频讲解) 第一部分 熟悉Linux基本操作 一.初识Linux 1.Linux特点 ◊ 开放性 ◊ 多用户 ◊ 多任务 ◊ ...
- 那些OVER的封装
什么over什么,如pppoe, ppp的封装都在over对象之后,入下图: PPPOE Ipsec
- 学习心得:《十个利用矩阵乘法解决的经典题目》from Matrix67
本文来自:http://www.matrix67.com/blog/archives/tag/poj大牛的博文学习学习 节选如下部分:矩阵乘法的两个重要性质:一,矩阵乘法不满足交换律:二,矩阵乘法满足 ...
- Web API 安全问题
目录 Web API 安全概览 安全隐患 1. 注入(Injection) 2. 无效认证和Session管理方式(Broken Authentication and Session Manageme ...