本页二维码,扫一扫分享到朋友圈
朋友圈

简单的ajax轻库


阅读198 评论0 赞 40返回首页    go 编程与技术  go javascript


 demo, readme.js 

// 这个简易的函式库并没有 jQuery 特有的完善 Promiss Chain

// 但是,这个函式库可以让你在不引入庞大的 jQuery 函式库情况下,

// 有一种类似于 jQuery 的方便的网络操作辅助。

// 提交数据

$post('/json/update_user', {

user: 'Jixun'

}, function (r){

console.info('Reply From Server:', r);

}));

// 抓取资源

$get('/json/get_user', function (r){

console.info('Reply From Server:', r);

}));

// 通用方法

$ajax({

type: 'POST',

url: '/get_lucky',

done: function (r) {

console.info('done!');

},

fail: function () {

console.info('ball!');

},

always: function () {

console.info('get next lucky number ..');

},

data: { auth: '1$Jixun' },

headers: {

'X-Forwarded-For': '1.2.3.4',

'X-Real-IP': '4.3.2.1'

}

});

 Simple Ajax.js 

// 简易 Ajax 函数

// MIT License, Jixun.Moe

(function (global) {

var _export = {

ajax: $ajax,

post: $post,

get: $get

};

function foreach (obj, callback) {

if (obj) {

for (var x in obj) {

if (obj.hasOwnProperty(x)) {

callback(x, obj[x], obj);

}

}

}

}

foreach(_export, function (x, _item) {

global['$' + x] = _item;

});

function isFunction (fn) {

return 'function' == typeof fn;

}

function $ajax (opts) {

var xhr = new XMLHttpRequest();

if (!opts.type && opts.data)

opts.type = 'POST';

xhr.responseType = opts.dataType || '';

xhr.open(opts.type || 'GET', opts.url);

if (opts.type == 'POST' && !(opts.headers && opts.headers.hasOwnProperty('Content-type'))) {

xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

}

foreach(opts.headers, function (headerName, headerValue) {

xhr.setRequestHeader(headerName, headerValue);

});

var postData;

switch(typeof opts.data) {

case 'string':

postData = [opts.data];

break;

case 'object':

if (opts.data instanceof Array) {

postData = opts.data;

} else {

postData = [];

foreach(opts.data, function (name, value) {

postData.push(encodeURIComponent(name) + '=' + encodeURIComponent(value));

});

}

break;

}

if (!isFunction(opts.always))

opts.always = emptyFunction;

xhr.onload = function () {

var data = tryParseJson(xhr.responseText);

if (isFunction(opts.done)) {

opts.done(data, xhr);

}

opts.always(xhr.status, xhr);

};

if (opts.hasOwnProperty('timeout')) {

xhr.timeout = parseInt(opts.timeout);

}

xhr.onerror = xhr.ontimeout = function () {

if (isFunction(opts.fail)) {

opts.fail(xhr.status, xhr);

}

opts.always(xhr.status, xhr);

};

if (isFunction(opts.preSend))

opts.preSend(xhr);

xhr.send(postData ? postData.join('&') : '');

}

function $post (url, data, success, fail) {

$ajax({

url: url,

data: data,

done: success,

fail: fail

});

}

function $get (url, success, fail) {

$ajax({

url: url,

done: success,

fail: fail

});

}

function tryParseJson (str) {

if ('string' == typeof str && str[0] != '{') {

// If there's an error,

// roll back to origional string.

try { return JSON.parse(str); }

catch (err) { }

}

return str;

}

function emptyFunction (){}

})(window);


  上一篇:go js使用FileReader和Google的md5.js计算文件的MD5值
  下一篇:go 异步加载javascripot脚本解决方案


评论


用QQ登录管理/创建网站 用微博登录管理/创建网站   发布于:11-27