AJAX的实现

var sAjax = function () {
var sendMsg = {
url: "",
sendType: "POST",
ContentType: "application/x-www-form-urlencoded",
msgType: "JSON",
data: {},
success: function (data) { },
error: function (data) { },
send: function () {
var url = "";
if (sendMsg.sendType == "POST") {
url = sendMsg.url;
} else {
url = sendMsg.url + "?" + postData(sendData.data);
}
var xhr = new XMLHttpRequest();
xhr.open(sendMsg.sendType, url, true);
xhr.setRequestHeader("Content-type", sendMsg.ContentType);
xhr.onreadystatechange = function () {
var XMLHttpReq = xhr;
if (XMLHttpReq.readyState == 4) {
if (XMLHttpReq.status == 200) {
var text = XMLHttpReq.responseText;
if (sendMsg.msgType == "JSON") {
console.log(text);
sendMsg.success(eval('(' + text + ")"));
} else {
sendMsg.success(text);
}
} else {
sendMsg.error(XMLHttpReq.status);
}
}
};
xhr.send(postData(sendMsg.data));
}
}
function postData(obj) { // 转成post需要的字符串.
var str = "";
for (var prop in obj) {
str += prop + "=" + obj[prop] + "&"
}
return str;
};
return sendMsg;
}

注意1:

构造函数中的sendMsg内的send方法中不可使用this.的方式获取sendMsg对象中的属性,因为this是静态的,当使用var a =new sAjax()实例化对象时this就已经生成了,这个时候this中的属性还没有被赋值this.url=null。

注意2:

使用eval()函数转换json字符串时应当使用sendMsg.success(eval('(' + text + ")"))的方式进行解析,使用sendMsg.success(eval( text))会报错提示“VM444:1 Uncaught SyntaxError: Unexpected token

javaScript AJAX的更多相关文章

  1. JavaScript Ajax之美~

    JavaScript Ajax之美~ 曾经有一段时期,因为开发人员对JavaScript的滥用导致其遭受了一段时间的冷门时期,不被大家看好,后来,到了2005年,Google公司的很多技术都是用了aj ...

  2. ajax 跨域 headers JavaScript ajax 跨域请求 +设置headers 实践

    解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头.正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现. 此处手札 供后人参 ...

  3. 2、.net NVelocity中原生javascript ajax封装使用

    在页面上,我们经常会遇到局部刷新的例子,这个时候,就需要用到ajax, 因为很多代码都是公用的,所以我们想到了,将代码封装,简化了使用,减少了冗余 javascript ajax代码如下: var x ...

  4. javascript ajax 脚本跨域调用全解析

    javascript ajax 脚本跨域调用全解析 今天终于有点时间研究了一下javsscript ajax 脚本跨域调用的问题,先在网上随便搜了一下找到一些解决的办法,但是都比较复杂.由是转到jqu ...

  5. 【转】ajax 跨域 headers JavaScript ajax 跨域请求 +设置headers 实践

    解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头.正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现. 此处手札 供后人参 ...

  6. 7 款基于 JavaScript/AJAX 的文件上传插件

    本文整理了7款基于JavaScript和AJAX的文件上传插件,这些插件基本上都能实现以下功能: 多文件上传 拖拽操作 实时上传进度 自定义上传限制 希望能为你的开发工作带来帮助. 1.  jQuer ...

  7. [转载]javascript+ajax+jquery教程11--正则表达式

    原文地址:javascript+ajax+jquery教程11--正则表达式作者:morflame 正则表达式可以: 测试字符串的某个模式.例如,可以对一个输入字符串进行测试,看在该字符串是否存在一个 ...

  8. JavaScript AJAX原生写法

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  9. 非常优秀的Javascript(AJAX) 开发工具:Aptana

    非常优秀的Javascript(AJAX) 开发工具:Aptana 下面我要向你介绍一款非常优秀的Javascript(AJAX) 开发工具:Aptana.应为它实在太棒了,所以我忍不住想向你推荐它. ...

  10. javascript --- Ajax基础

    神马是Ajax? Ajax即‘Asynchronous javascript and XML’(异步javascript和XML),也就是所谓的无刷新页面读取技术. http请求 首先要了解http请 ...

随机推荐

  1. ORA-29275: partial multibyte character

    查询表报错 修改方式1 和字符集存储方式有关系 ,修改客户端和服务器的字符集存储方害死 修改方式2 修改表的字段由nvarchar2修改为varchar2

  2. CSS之元素选择器

    1.后代元素选择器 div p 以空格分隔,表示div的所有后代p元素 2.子元素选择器 div > p 以大于号分隔,表示div的直接子元素 3.相邻兄弟选择器 div  + p 选择紧接在d ...

  3. Windows RabbitMQ 命令

    启动: 后台运行:rabbitmq-server -detached D:\Program Files\RabbitMQ Server\rabbitmq_server-3.6.6\sbin>ra ...

  4. java字典序全排列

    import java.util.Arrays; /** *字典序全排列 *字符串的全排列 *比如单词"too" 它的全排列是"oot","oto&q ...

  5. Asp.Net Mvc4 Webapi Request获取参数

    最近用mvc4中的WEBAPI,发现接收参数不是很方便,跟传统的request.querystring和request.form有很大区别,在网上搜了一大圈,各种方案都有,但不是太详细,于是跟踪Act ...

  6. 初识Redis(1)

    Redis 是一款依据BSD开源协议发行的高性能Key-Value存储系统(cache and store). 它通常被称为数据结构服务器,因为值(value)可以是 字符串(String), 哈希( ...

  7. javascript中apply、call和bind的区别

    在JS中,这三者都是用来改变函数的this对象的指向的,他们有什么样的区别呢.在说区别之前还是先总结一下三者的相似之处:1.都是用来改变函数的this对象的指向的.2.第一个参数都是this要指向的对 ...

  8. 如何将页面的<br/>在Excel中正确换行

    在页面的<br />导致导出Excel中是会以多行的方式显示,达不到页面在一个单元格中进行换行,为此我们有以下两种方式: 1.CSS样式方式 <br style='mso-data- ...

  9. Android Activity 管理 (AppManager)(非原创)

    AppManager 类: /** * 应用程序Activity管理类:用于Activity管理和应用程序退出 *  */ public class AppManager {     private ...

  10. STL-<queue>-priority queue的使用

    简介: 优先队列是一种容器适配器,优先队列的第一个元素总是最大或最小的(自定义的数据类型需要重载运算符).它是以堆为基础实现的一种数据结构. 成员函数(Member functions) (const ...