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 ...
随机推荐
- 【温故而知新-CSS】使用CSS设计网站导航栏
body #nav li a { width: auto; } #nav li a:hover { background-color: #ffcc00; color: #fff; border-rig ...
- leetcode: Path Sum II 迭代法
Given a binary tree and a sum, find all root-to-leaf paths where each path's sum equals the given su ...
- 详解Java的MyBatis框架中SQL语句映射部分的编写
这篇文章主要介绍了Java的MyBatis框架中SQL语句映射部分的编写,文中分为resultMap和增删查改实现两个部分来讲解,需要的朋友可以参考下 1.resultMap SQL 映射XML 文件 ...
- Linux下安装使用NMON监控、分析系统性能
背景:今天在LoadRunner11.0中使用rstat监控linux过程中,始终提示如下错: Monitor name :UNIX Resources. Cannot initialize the ...
- TIF、JPG图片手动添加地理坐标的方法(转载)
题目:为TIF.JPG图片添加地理坐标/平面直角坐标. 图片来源:GOOGLE EARTH.(当然也可以是其他知道四角点坐标的图片) 截图工具:GEtscreen(此软件截图时可以自动生成图片四角点坐 ...
- NET Core应用?
NET Core应用? 在<历数依赖注入的N种玩法>演示系统自动注册服务的实例中,我们会发现输出的列表包含两个特殊的服务,它们的对应的服务接口分别是IApplicationLifetime ...
- java内部类 2016年12月13号
1.在外部类的任意位置创建内部类对象的方法: 1)从外部类的非静态方法之外的任意位置创建某个内部类的对象,必须指明这个对象所在的外部类和内部类:OuterClassName.InnerClassNam ...
- 文件“D:\file.txt”正由另一进程使用,因此该进程无法访问该文件。
关于如题的解决方案! 都是有一定编程基础的人,我就不讲其它的了. 1.在实例化一个FileStream后,用完它一定要关闭.先试试这一条: 2.第一条不起作用的话,用本条.在实例化FileStream ...
- css margin 参数
margin 参数 margin: (1)一个参数值,将用于全部的四边. (2)两个参数值,第一个用于上-下,第二个用于左-右. (3)三个参数值,第一个用于上,第二个用于左-右,第三个用于下. (4 ...
- WireShark系列: 使用WireShark过滤条件抓取特定数据流(zz)
应用抓包过滤,选择Capture | Options,扩展窗口查看到Capture Filter栏.双击选定的接口,如下图所示,弹出Edit Interface Settints窗口. 下图显示了Ed ...