Ajax异步交互 [异步对象连接服务器]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>XMLHttpRequest</title>
<script>
var xmlHttp; //声明一个全局变量xmlHttp,主要是考虑到异步对象在整个页面进程中都有可能使用到。
function createXMLHttpRequest(){ //创建一个异步对象的函数,
if(window.ActiveXObject) //该函数主要利用if语句进行浏览器的判断,如果是IE浏览器则采用ActiveXObject的创建方法,如果不是则直接利用XMLHttpRequest()函数,考虑兼容性,因此需要对浏览器进行判断,这基本是Ajax创建异步对象的通用方法。
xmlHttp=new ActiveXObject('Microsoft.XMLHTTP');
else if(window.XMLHttpRequest)
xmlHttp=new XMLHttpRequest();
}
function startRequest(){
createXMLHttpRequest(); //调用已经写好的函数,创建一个异步对象
xmlHttp.open('GET','new_file.xml',true); //建立一个到服务器的请求, true是异步请求,open(method,url,asynchronous,user,password),asynchronous是一个布尔值,表示是否为异步请求,默认为异步请求true。user、password分别为可选的用户名、密码。
xmlHttp.onreadystatechange=function(){ //readystate属性判断目前请求的状态,如果该属性变化了,就会触发onreadystatechange事件。
if(xmlHttp.readyState==4 && xmlHttp.status==200) //如果readyState的状态为4(数据接收成功)则继续操作。并且一般情况下还要判断服务器返回的响应状态status。
alert('服务器返回:'+xmlHttp.responseText);
}
xmlHttp.send(null); //将该请求发送给服务器。send(body); 参数body,它表示要向服务器发送的数据,其格式为查询字符串的形式,例如:var body="myName=isaac&age=25";
}
</script>
</head>
<body>
<input type="button" value="测试异步通信" onclick="startRequest()" />
</body>
</html>
注意:
如果使用POST方法进行提交请求,那么在发送前必须使用如下的语句来设置HTTP的头,语法如下:
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
var queryString = "firstName=isaac&birthday=0624";
var url="9-3.aspx?timestamp="+new Date().getTime();
xmlHttp.open("POST",url);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttp.send(queryString); //该语句负责发送数据
2,解决异步连接服务器时IE的缓存问题
var sUrl="9-1.aspx?" + new Date().getTime(); //地址不断的变化
xmlHttp.open("GET", sUrl, true);
Ajax异步交互 [异步对象连接服务器]的更多相关文章
- 实现AJAX的异步交互的步骤
<input type="button" value="异步请求"id="btn"> <script> 实现ajax ...
- AJAX 异步交互基本总结
AJAX (Asynchronous JavaScript and Xml) 直译中文 - javascript和XML的异步 同步与异步的区别: 同步交互 执行速度相对比较慢 响应的是完整的HTML ...
- Ajax异步交互基础
1. ajax是什么? * asynchronous javascript and xml:异步的js和xml * 它能使用js访问服务器,而且是异步访问! * 服务器给客户端的响应一般是整个页面,一 ...
- 原生Ajax实现异步交互
实现Ajax主要依靠XMLHttpRequest对象,所以首先要创建XMLHttpRequest对象 function getXhr(){ var xhr = null; if(window.XMLH ...
- spring mvc 和ajax异步交互完整实例
Spring MVC 异步交互demo: 1.jsp页面: <%@ page language="java" contentType="text/html; cha ...
- 表单验证--通过原生js模仿ajax的异步交互
今天给大家带来个福利,我也是刚刚学习的很实用的一个东西,通过原生js模仿ajax的异步交互. 我的博客只是给那些新手看的大神勿喷,写的不好可留言,请指出. 因为当初自己学的时候一个问题不会找人问,知道 ...
- 使用AJAX技术发送异步请求,HTTP服务端推送
使用AJAX技术发送异步请求 什么是AJAX AJAX指一步Javascript和XML(Asynchronous JavaScript And XML),它是一些列技术的组合,简单来说AJAX基于X ...
- Ajax同步与异步优缺点与使用
一.什么是同步请求:(false) 同步请求即是当前发出请求后,浏览器什么都不能做,必须得等到请求完成返回数据之后,才会执行后续的代码,相当于是排队,前一个人办理完自己的事务,下一个人才能 ...
- 使用html5 FileReader获取图片,并异步上传到服务器(不使用iframe)
使用html5 FileReader获取图片,并异步上传到服务器(不使用iframe) 原理: 1.使用FileReader 读取图片的base64编码 2.使用ajax,把图片的base64编码 ...
随机推荐
- 4天精通arcgis
真是掉进了一个史无前例的坑 --ArcGIS产品线为用户提供一个可伸缩的,全面的GIS平台. 这是百科的介绍,简单来讲,这就是一个地图,可以搞事情. 学的是ArcGIS API for JavaScr ...
- MAC 下虚拟主机的配置
第一部分:httpd.conf 1:找到这段,改成如下这样 <Directory /> Options Indexes FollowSymLinks AllowOverride All O ...
- BootStrap Table使用小结
1.在当前表格的最后新增数据 $("#data_module_table").bootstrapTable('append', data.data);//data.data---- ...
- 数据库集群 MySQL主从复制
MySQL主从复制 本节内容我们联系使用MySQL的主从复制功能配置Master和Slave节点,验证数据MySQL的数据同步功能. 因为要使用多个MySQL数据库,所以不建议在电脑上安装多个MySQ ...
- Java面试常会被问到的经典面试题,学习或者求职,你都要好好掌握
Java现在的热度虽然有所下降,但是,学Java的人依旧很多..Java的岗位也是渗透很多.那么,那些经典的Java知识点,你能看到问题就能说出一二三吗?来一起看看.. 1.JDK和JRE的区别 2. ...
- Java微信公众平台开发_06_素材管理
一.本节要点 1.官方文档的media 这个media可以理解为文件,即我们需要以POST方式提交一个文件 2.媒体文件有效期 媒体文件在微信后台保存时间为3天,即3天后media_id失效. 二.代 ...
- 原生JS—实现图片循环切换的两种方法
今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法.多余的话我们就不多说了,我们一个一个开始讲吧. 1 原生JS实现图片循环切换 -- 方法一 在上栗子之前我们先简单介绍一下所用的一些知识点. ...
- 第2篇 C#数据类型-值类型与引用类型
一 C#内存分配 在应用程序与操作系统之间有一个"中间人"--公共语言运行时(Common Language Runtime,CLR).它为应用程序提供内`存管理,线程管理和远程处 ...
- install plugin group_replication ERROR 1126 (HY000)
在给MySQL安装插件的时候,你可能会遇到如题所示的报错. 更详细的错误输出如下: mysql> INSTALL PLUGIN group_replication SONAME 'group_r ...
- JAVA基础面试(二)
11.是否可以从一个static方法内部发出对非static方法的调用? 不可以.因为非static方法是要与对象关联在一起的,必须创建一个对象后,才可以在该对象上进行方法调用,而static方法调用 ...