原生的AJAX写法,可以直接复制过来套用
方法一:
function createXMLHTTPRequest() {
//1.创建XMLHttpRequest对象
//这是XMLHttpReuquest对象无部使用中最复杂的一步
//需要针对IE和其他类型的浏览器建立这个对象的不同方式写不同的代码
var xmlHttpRequest;
if (window.XMLHttpRequest) {
//针对FireFox,Mozillar,Opera,Safari,IE7,IE8
xmlHttpRequest = new XMLHttpRequest();
//针对某些特定版本的mozillar浏览器的BUG进行修正
if (xmlHttpRequest.overrideMimeType) {
xmlHttpRequest.overrideMimeType("text/xml");
}
} else if (window.ActiveXObject) {
//针对IE6,IE5.5,IE5
//两个可以用于创建XMLHTTPRequest对象的控件名称,保存在一个js的数组中
//排在前面的版本较新
var activexName = ["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];
for (var i = ; i < activexName.length; i++) {
try {
//取出一个控件名进行创建,如果创建成功就终止循环
//如果创建失败,回抛出异常,然后可以继续循环,继续尝试创建
xmlHttpRequest = new ActiveXObject(activexName[i]);
if (xmlHttpRequest) {
break;
}
} catch (e) {
}
}
}
return xmlHttpRequest;
}
//post方法
function post() {
//创建AJAX原生环境后用变量接收
var req = createXMLHTTPRequest();
if (req) {
//传参方式,url,是否异步(asyn)
req.open("POST", "webAjax.ashx", true);
//post必须设置这个类型
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//必须带这个传参,就算你要调用的方法不带参数,不管是get还是post有参传参,没参传空
req.send("");
//回调函数,当 readyState 等于 4 且状态为 200 时,表示响应已就绪,可以做数据操作了
req.onreadystatechange = function () {
if (req.readyState == ) {
if (req.status == ) {
//req.responseText可以返回后台的返回内容
alert("success");
} else {
alert("error");
}
}
}
}
}
//get方法
function get() {
var req = createXMLHTTPRequest();
if (req) {
req.open("GET", "AJAXTest.aspx", true);
req.onreadystatechange = function () {
if (req.readyState == ) {
if (req.status == ) {
alert(req.responseText);
} else {
alert("error");
}
}
}
req.send(null);
}
}
方法二:
//以get方法为例
var xmlhttp;
function loadXMLDoc(url, cfunc) {
//创建环境
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//创建回调函数
xmlhttp.onreadystatechange = cfunc;
//get方式发送数据
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
function myFunction() {
//调用上述的AJAX方法,传入url和回调函数的实现方法(响应就绪时会执行)
loadXMLDoc("/ajax/test1.txt", function () {
if (xmlhttp.readyState == && xmlhttp.status == ) {
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
}
});
}
原生的AJAX写法,可以直接复制过来套用的更多相关文章
- screen,client,page三种确定鼠标坐标的区别和原生JS事件写法,区别于Jquery的$.on(x,y);和$.click()
screenX clientX pageX的区别 screenX:鼠标位置相对于用户屏幕水平偏移量,而screenY也就是垂直方向的,此时的参照点也就是原点是屏幕的左上角. clientX:跟scre ...
- 使用XMLHttpRequest对象完成原生的AJAX请求
1.大家眼中的Ajax 说到Ajax,只要有过前端开发经验的童鞋一定都不陌生,大都知道它就是一种与后端之间的通信技术,通过这个神奇的家伙,我们不用像传统表单那样填完信息一点提交就呼啦呼啦跳转了.Aja ...
- 原生js ajax与jquery ajax的区别
原生js ajax的调用: ajax({ type : "get", url : "02_ajax_get.txt", data : { "userN ...
- js原生的Ajax
js原生的Ajax其实就是围绕浏览器内内置的Ajax引擎对象进行学习的,要使用js原 生的Ajax完成异步操作,有如下几个步骤: 1)创建Ajax引擎对象 2)为Ajax引擎对象绑定监听(监听服务器已 ...
- 原生Ajax写法(GET)
ajax的GET提交方式的原生代码: var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else if(w ...
- 原生ajax写法
ajax1.0,ie9及以下,ie10+支持ajax2.0 ajax2.0比ajax1.0: 1.多了FormData对象,xhr.send(formData) //不能用GET 2.文件上传,文件 ...
- JS 原生ajax写法
<script> //step1.创建XMLHTTPRequest对象,对于低版本的IE,需要换一个ActiveXObject对象 var xhr; if (window.XMLHttpR ...
- 原生实现ajax解析--XMLHttpRequest
ajax基础: Asynchronous JavaScript and XML,意思就是用JavaScript执行异步网络请求. 如果仔细观察一个Form的提交,你就会发现,一旦用户点击“Submit ...
- 原生javascript Ajax
代码 1. IE5 ,IE6 使用ActiveXObject对象, 其余现代浏览器都支持XMLHttpRequest对象: function ajaxObject(){ var xmlhttp; ...
随机推荐
- 51nod1556 计算
ans[n]=ans[n-1]*3-m[n-2];YY一下可以懂的.减掉的就是往下走的情况不符合正整数的情况.m是默慈金数. #include<cstdio> #include<cs ...
- poj2750 线段树 +DP Potted Flower
问题描述:给定一个环形序列,进行在线操作,每次修改一个元素,输出环上的最大连续子列的和,但不能是完全序列. 算法:把环从一个地方,切断拉成一条直线,用线段树记录当前区间的非空最大子列和当前区间的非空最 ...
- 每个极客都应该知道的Linux技巧
每个极客都应该知道的Linux技巧 2014/03/07 | 分类: IT技术 | 0 条评论 | 标签: LINUX 分享到:18 本文由 伯乐在线 - 欣仔 翻译自 TuxRadar Linux. ...
- Servlet的页面跳转
Servlet的跳转 内部跳转 req.getRequestDispatcher() Server--->AServlet--->BServlet 两个S ...
- InputStream重用技巧(利用ByteArrayOutputStream)
有时候我们需要对同一个InputStream对象使用多次.比如,客户端从服务器获取数据 ,利用HttpURLConnection的getInputStream()方法获得Stream对象,这时既要把数 ...
- MySQL集群的可行方案
如果单MySQL的优化始终还是顶不住压力时,这个时候我们就必须考虑MySQL的高可用架构(很多同学也爱说成是MySQL集群)了,目前可行的方案有: 一.MySQL Cluster优势:可用性非常高,性 ...
- Mac 上安装MySQL
http://blog.neten.de/posts/2014/01/27/install-mysql-using-homebrew/ http://www.wkii.org/mac-os-x-ins ...
- Centos移除图形界面
在此之前为了试验SAS Linux,在一台centos服务器上安装了desktop界面, 目前需要删除这些界面组件,可以按照以下步骤实现: 1. yum grouplist查看安装的组件 2. 使用y ...
- xampp无法打开phpmyadmin解决方案
如果设置了apache的端口号(如8890),那么不可以用自带的admin按钮打开,而是要加上端口(如localhost:8890/phpmyadmin/)
- Cannot run program "/home/mohemi/Program/adt-bundle-linux-x86_64-20130729/sdk//tools/emulator": error=2, 没有那个文件或目录
在64位的Ubuntu下,安装ADT64位的,打开android模拟器出现以下报错: Starting emulator for AVD 'Android' Failed to start emula ...