function ajax(options) {
//请求参数
options = {
//类型
type: options.type || "Post",
//地址
url: options.url || "",
//超时时间
timeout: options.timeout || 5000,
//完成函数
onComplete: options.onComplete || function () { },
//错误函数
onError: options.onError || function () { },
//执行成功
onSuccess: options.onSuccess || function () { },
//传递数据
data: options.data || "",
//返回的数据类型
datatype: options.datatype || "string",
};
//创建请求对象
var xml = new XMLHttpRequest();
//初始化异步请求
xml.open(options.type, options.url, true);
//请求超时时间
var timeoutLength = options.timeout;
//请求是否成功
var requestDone = false;
//初始化一个超时执行回调函数,用于取消请求
setTimeout(function () {
requestDone = true;
}, timeoutLength); //监听文档状态的更新
xml.onreadystatechange = function () {
//保持等待,直到数据完全加载,并保证请求并未超时
if (xml.readyState == 4 && !requestDone) {
//检查请求是否成功
if (httpSuccess(xml)) {
//以服务器返回的数据作为参数调用成功回调函数
options.onSuccess(httpData(xml, options.datatype));
} else {
//发生错误时执行错误回调函数
options.onError();
}
//执行完成回调函数
options.onComplete();
//清理文档,避免内存泄露
xml = null;
}
};
//建立与服务器的连接
xml.send(); //判断http是否响应成功
function httpSuccess(r) {
try {
//如果得不到服务器状态且我们正在请求本地文件,认为成功
return !r.status && location.protocol == "file:" ||
//所有的200~300状态码表示成功
(r.status >= 200 && r.status < 300) ||
//文档未修改也表示成功
r.status == 304 ||
//Safari在文档未修改时返回空状态
navigator.userAgent.indexOf("Safari") >= 0
&& typeof r.status == "undefined";
} catch (e) {
//若检查状态失败,则假定请求是失败的
return false
}
} //从http响应中解析正确的数据
function httpData(r, type) {
//获取content-type的首部
var ct = r.getResponseHeader("content-type");
//若没有提供类型,判断服务器返回的是否是xml形式
var data = !type && ct && ct.indexOf("xml") >= 0;
//若是,获得xml文档对象,否则返回文本内容
data = type == "xml" || data ? r.responseXml : r.responseText;
//若指定类型是 script ,则以Javascript形式返回文本
if (type == "script") {
eval.call(window, data);
} else if (type == "json") {
data = eval(data);
}
//返回响应数据
return data;
}
}

  使用

ajax({
url: "/Home/GetTestData",
type: "get",
datatype: "json",
onSuccess: function (result) {
alert(result);
},
onError: function (xhr) {
var x = xhr;
}
});

  

一个简单的ajax对象的更多相关文章

  1. Ajax得知(两)—— 一个简单的Ajax示例

    通过部分博客认识Ajax之后,我们通过一个简单的实例来消化消化理论知识,一睹Ajax的庐山真面目. 1.实例功能: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZ ...

  2. 一个简单的AJAX实例

    创建一个简单的XMLHttpRequest,从一个TXT文件中返回数据. 来源于菜鸟教程 <!DOCTYPE html><html><head><meta c ...

  3. DOM编程艺术章12:一个简单的Ajax例子

    大概入了JavaScript的门,现在要回过头恶补Ajax和json了,随手翻到dom编程艺术发现有一个适合回忆的例子,先抄录下来,引入对Ajax作用的大概印象,再去掰开了研究. <!DOCTY ...

  4. 自己封装一个简单的ajax插件

    function myAjax(obj) { var xmlHttp; //保存xmlHttpRequest对象 var type = obj.requestType; //保存请求方式 var ca ...

  5. 注解@requestBody自动封装复杂对象 (成功,自己的例子封装的不是一个复杂对象,只是一个简单的User对象,将jsp页面的name转成json字符串,再用JSON.stringify()传参就行了)

    注意:ajax向后台传值的时候,必须加上contentType:"application/json"; springmvc的注解@requestBody可以通过页面提交json来自 ...

  6. 封装一个简单的ajax请求

    记录自己第一次封装ajax,肯定有很多考虑不周到,如有错误请指出,本人必将虚心改正. /** * * @param {Object} obj =>header:请求头:url:请求地址:meth ...

  7. 一个简单的aJax——后台用servlet技术

    示例:webDemo 一.客户端 <%-- Created by IntelliJ IDEA. User: Administrator Date: 15-12-2 Time: 上午5:41 To ...

  8. struts2框架下的一个简单的ajax例子

    举个例子 jsp页面: <%@ page language="java" import="java.util.*" pageEncoding=" ...

  9. 一个简单的ajax上传 上传进度显示

    本例用了jquery.form.js请到演示页面查看 CSS Code <style> form { display: block; margin: 20px auto; backgrou ...

随机推荐

  1. FineUI 点击按钮添加标签页

    <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat=&quo ...

  2. Xcode简易基础篇,以新手角度去操作

    声明:此Newlife XCode非Mac的XCode,避免误会. 日常用的Newlife X组件的相关资源,不限于XCode,只是以XCode组件为主: 1.QQ群:1600800 2.博客 : h ...

  3. iPhone手机的屏幕尺寸、分辨率及适配

    1.iPhone尺寸规格 设备 iPhone 宽 Width 高 Height 对角线 Diagonal 逻辑分辨率(point) Scale Factor 设备分辨率(pixel) PPI 3GS ...

  4. HTML5比较实用的代码

    增强IE兼容性 <!--[if IE]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js&q ...

  5. HTML&CSS基础学习笔记—创建列表

    创建一张表格 很多时候我们需要在网页上展示一些数据,使用表格可以很好的来展示数据. 在HTML中<table>标签定义 表格. <table> </table> 添 ...

  6. android Canvas drawText 文字居中

    1首先利用canvas获取画布的宽高, //获取屏幕的宽和高int width = canvas.getWidth();int height = canvas.getHeight(); 2获取文字的宽 ...

  7. 【object-c基础】Object-c基础之三:面对对象开发@interface,@implementation

    1.@interface 在java等语言编程中,创建类都是用class,但在object-c中,用@interface. 例子: @interface circle :NSObject    //定 ...

  8. jQuery插件autoComplete使用

    安装/需要引入的文件 <script type="text/javascript" src="../js/jquery-1.8.3.min.js.js"& ...

  9. HTML5实现的视频播放器01

    HTML5实现的视频播放器   什么是hivideo? 最近一段时间在使用PhoneGap开发一个App应用,App需要播放视频,本想直接使用html5的video,但使用它在全屏播放时不支持横屏播放 ...

  10. Linux基础知识入门

    [Linux基础]Linux基础知识入门及常见命令.   前言:最近刚安装了Linux系统, 所以学了一些最基本的操作, 在这里把自己总结的笔记记录在这里. 1,V8:192.168.40.10V1: ...