Easy.Ajax 部分源代碼 支持文件上傳功能, 兼容所有主流瀏覽器
更新時(shí)間:2011年02月24日 23:57:49 作者:
下面是Easy.Ajax類(lèi)的初稿,如須發(fā)表,在代碼上還要修改以達(dá)到最簡(jiǎn),但API是不會(huì)變了
復(fù)制代碼 代碼如下:
Easy.Ajax = {
proxyPool: {
length: function () {
var i = 0;
for (var p in this)
i++;
return i - 1;
}
},
index: 0,
async: true,
xmlData: false,
timeout: 1,
defaultHeader: 'application/json; charset=utf-8',
clearCache: true,
emptyFn: function () {
},
defaultHandlers: {
empty: function () { },
onerror: this.empty,
onload: this.empty,
ontimeout: this.empty,
onprogress: this.empty
},
createXhr: function (id) {
var py, pxy;
try {
var md = ["Msxml2.XMLHTTP", "Microsoft.XMLHTTP"];
try {
pxy = new XMLHttpRequest();
} catch (e) {
}
if (!pxy && window.XDomainRequest)
pxy = new XDomainRequest();
for (var i = 0; !pxy; i++)
try {
pxy = new ActiveXObject(md[i]);
} catch (e) {
}
py = {
conn: pxy,
isLoading: false,
id: id
};
this.proxyPool[id] = py;
} catch (e) {
return new Easy.Error(e, e.message);
} finally {
return pxy ? py : new Easy.Error('Null pointer');
}
},
setEvents: function (pxy, cfg, override) {
try {
var dh = this.defaultHandlers, props = cfg, conn = pxy.conn, me = this;
for (var p in dh) {
if (!override && conn.hasOwnProperty(p))
continue;
try {
conn[p] = props[p] || dh[p];
} catch (e) {
}
}
conn.onreadystatechange = function () {
if (conn.readyState == 4) {
pxy.isLoading = false;
(cfg.callback || me.callback).call(conn, conn.responseText
|| conn.responseXML.xml, cfg);
me.destroy(pxy.id);
}
}
} catch (e) {
} finally {
return conn;
}
},
callback: function (rsp, cfg) {
var emptyFn = function () {
};
if (this.status == 200) {
(cfg.success || emptyFn).call(this, rsp);
} else {
(cfg.failure || emptyFn).call(this, rsp, this.statue);
}
},
getParam: function (pms) {
return Easy.util.join(pms, "&");
},
open: function (method, url, async, cfg, uname, pwd) {
var me = this, pxy = this.createXhr(this.index++);
var conn = pxy.conn;
conn.open(method, url, async);
conn.setRequestHeader("Content-Type", cfg.xmlData || this.xmlData
? "text/xml"
: this.defaultHeader);
conn.setRequestHeader("timeout", this.timeout);
return pxy;
},
toRequstCfg: function (cfg) {
if (Easy.getType(cfg) == "string")
cfg = {
url: cfg
};
cfg.url = Easy.util.urlAppend(cfg.url, Math.random(5))
var form = Easy.DOM.get(cfg.form);
if (form) {
if (cfg.isUpload || /multipart\/form-data/i.test(form.getAttribute("enctype")))
cfg.isUpload = true;
else
cfg.params = Easy.util.serializeForm(form);
}
return cfg;
},
request: function (cfg, method) {
var pxy = this.open(method || "POST", cfg.url, true, cfg), proxy = pxy.conn;
proxy = this.setEvents(pxy, cfg, true);
var params = this.getParam(cfg.params), bl = cfg.beforeLoad;
if (bl && Easy.getType(bl) == "function" && bl.call(proxy) === false)
return;
proxy.send(params);
pxy.isLoading = true;
return pxy.id;
},
get: function (cfg) {
cfg = this.toRequstCfg(cfg);
if (cfg.isUpload)
return this.upload(cfg);
return this.request(cfg, "GET");
},
post: function (cfg) {
cfg = this.toRequstCfg(cfg);
if (cfg.isUpload)
return this.upload(cfg);
return this.request(cfg);
},
upload: function (cfg) {
var form = Easy.DOM.get(cfg.form);
var iframe = document.createElement("iframe");
var iframeID = "Easy_Ajax_Form_Submit";
Easy.DOM.setAttributes(iframe, {
id: iframeID,
name: iframeID,
width: "0px",
height: "0px",
style: "display:none;",
src: "about:blank"
});
Easy.DOM.render(iframe, form);
if (Easy.util.isIE)
document.frames[iframeID].name = iframeID;
var complete = function () {
Easy.DOM.destroy(iframe);
};
cfg.url = cfg.url || form.action;
Easy.DOM.setAttributes(form, {
action: Easy.util.urlAppend(cfg.url, cfg.params),
target: iframeID,
enctype: "multipart/form-data",
method: "POST"
});
var cb = function () {
try {
var me = this, r =
{
responseText: '', responseXML: null
},
doc,
firstChild;
try {
doc = iframe.contentWindow.document || iframe.contentDocument || window.frames[id].document;
if (doc) {
if (doc.body) {
if (/textarea/i.test((firstChild = doc.body.firstChild || {}).tagName)) {
r.responseText = firstChild.value;
}
else {
r.responseText = doc.body.innerHTML;
}
}
r.responseXML = r.responseText;
}
}
catch (e) {
}
(cfg.callback || cfg.success || complete).call(r, r.responseText ||
r.responseXML.xml, cfg);
} catch (e) {
(cfg.failure || cfg.callback || complete).call(r, e.message, cfg);
}
};
Easy.DOM.on(iframe, "load", cb, iframe);
form.submit();
},
destroy: function (id) {
this.abort(id);
delete this.proxyPool[id];
},
abort: function (id) {
if (!Easy.util.isIE6)
(((this.proxyPool[id] || {}).conn.abort) || this.emptyFn)();
}
};
您可能感興趣的文章:
- AJAX和JSP實(shí)現(xiàn)的基于WEB的文件上傳的進(jìn)度控制代碼
- ajax 文件上傳應(yīng)用簡(jiǎn)單實(shí)現(xiàn)
- jQuery Ajax文件上傳(php)
- Ajax方式提交帶文件上傳的表單及隱藏iframe應(yīng)用
- 利用ajaxfileupload插件實(shí)現(xiàn)文件上傳無(wú)刷新的具體方法
- php+ajax實(shí)現(xiàn)圖片文件上傳功能實(shí)例
- ajaxFileUpload.js插件支持多文件上傳的方法
- ThinkPHP結(jié)合AjaxFileUploader實(shí)現(xiàn)無(wú)刷新文件上傳的方法
- 基于ajax實(shí)現(xiàn)文件上傳并顯示進(jìn)度條
- ajax文件上傳成功 解決瀏覽器兼容問(wèn)題
相關(guān)文章
uni-app動(dòng)態(tài)修改主題色的方法詳解
最近在看uniapp開(kāi)發(fā)app時(shí)需要實(shí)現(xiàn)動(dòng)態(tài)修改主題色的功能,這篇文章主要給大家介紹了關(guān)于uni-app動(dòng)態(tài)修改主題色的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-12-12原生javascript自定義input[type=radio]效果示例
這篇文章主要介紹了原生javascript自定義input[type=radio]效果,結(jié)合實(shí)例形式分析了javascript模擬form表單中radio效果的相關(guān)操作技巧,需要的朋友可以參考下2019-08-08JavaScript模板引擎應(yīng)用場(chǎng)景及實(shí)現(xiàn)原理詳解
這篇文章主要介紹了JavaScript模板引擎應(yīng)用場(chǎng)景及實(shí)現(xiàn)原理,結(jié)合實(shí)例形式詳細(xì)分析了javascript模版引擎的具體應(yīng)用場(chǎng)景、實(shí)現(xiàn)原理、相關(guān)操作技巧與注意事項(xiàng),需要的朋友可以參考下2018-12-12js實(shí)現(xiàn)點(diǎn)擊彈窗彈出登錄框
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)點(diǎn)擊彈窗彈出登錄框,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-04-04Bootstrap3 圖片(響應(yīng)式圖片&圖片形狀)
這篇文章主要介紹了 Bootstrap3 圖片 響應(yīng)式圖片和圖片形狀的相關(guān)資料,需非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-01-01JavaScript實(shí)現(xiàn)商品放大鏡效果
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)商品放大鏡效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-10-10js點(diǎn)擊列表文字對(duì)應(yīng)該行顯示背景顏色的實(shí)現(xiàn)代碼
這篇文章主要介紹了js點(diǎn)擊列表文字對(duì)應(yīng)該行顯示背景顏色的實(shí)現(xiàn)代碼,感興趣的小伙伴可以參考下2015-08-08JavaScript 生成隨機(jī)數(shù)并自動(dòng)大小排序
JavaScript按規(guī)定生成隨機(jī)數(shù),并按指定順序自動(dòng)排序,本例中將生成1——100以?xún)?nèi)的隨機(jī)數(shù),并按照由小到大的順序排列起來(lái)。2009-12-12