<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-TW" xml:lang="zh-TW">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Send Post</title>
<script type="text/javascript">
var sendPost = function() {
this.current = null;
this.queue = [];
};
sendPost.prototype.request = function(q) {
var self = this;
var query = [];
var formdata = new FormData(document.createElement('form'));
for(key in q.params) {
switch(q.params[key].constructor) {
case Number:
formdata.append(key, q.params[key]);
break;
case String:
formdata.append(key, q.params[key]);
break;
case Array:
for(var i=0;i<q.params[key].length;i++) {
formdata.append(key, q.params[key][i]);
}
break;
default:
var type = q.params[key].getAttribute("type");
if(type == 'file') {
for(var i=0;i<q.params[key].files.length;i++) {
formdata.append(key, q.params[key].files[i]);
}
} else if(type=='password'||type=='text'||type=='hidden') {
formdata.append(key, q.params[key].value);
}
break;
}
}
var xobj = new XMLHttpRequest();
xobj.overrideMimeType('application/json');
xobj.open('POST', q.url, true);
xobj.onreadystatechange = function () {
if (xobj.readyState == 4 && xobj.status == '200') {
self.current.load(JSON.parse(xobj.responseText));
self.action();
}
};
this.queue.push({
xobj : xobj,
formdata : formdata,
load : q.load
});
if(!this.current) this.action();
};
sendPost.prototype.action = function() {
this.current = null;
if(this.queue.length) {
this.current = this.queue.shift();
this.current.xobj.send(this.current.formdata);
}
};
window.onload = function() {
document.getElementById('btn').onclick = function() {
var mySendPost = new sendPost();
mySendPost.request({
url : '/test?method=work',
params : {
'file' : document.getElementById('myfile'),
'name' : document.getElementById('myname'),
'password' : document.getElementById('mypassword'),
'hidden' : document.getElementById('myhidden'),
'str' : 'Hello',
'num1' : 20,
'num2' : new Array(30, 40)
},
load : function(data) {
document.getElementById('output').innerHTML = JSON.stringify(data, null, 2);
}
});
};
};
</script>
</head>
<body>
<input type="file" id="myfile" multiple="multiple" /><br />
<input type="text" id="myname" value="QQBoxy" /><br />
<input type="password" id="mypassword" value="abcd1234" /><br />
<input type="hidden" id="myhidden" value="HideBoxy" />
<button id="btn">Button</button><br />
<pre id="output"></pre>
</body>
</html>
