<input type="file">

//监听 input 的 change 事件，获取要上传的数据input.onchange = function () {    //input.files 属性需要浏览器支持    var files = this.files;    for (var i = 0, len = files.length; i < len; i++) {        var file = files[i];        //file.name || file.fileName  => 文件名称        //file.size || file.fileSize  => 文件大小        upload_html5(file);    }};

//html5 上传var xhr = new XMLHttpRequest();//上传进度事件xhr.upload.addEventListener("progress", function (e) { }, false);//上传完成（成功）事件xhr.addEventListener("load", function (e) {    //获取服务器响应    var text = e.target.responseText;}, false);//上传失败事件xhr.addEventListener("error", function (e) { }, false);//上传中断（取消）事件xhr.addEventListener("abort", function (e) { }, false);var fd = new FormData;//添加要上传的文件对象

fd.append("file", file);xhr.open("POST", "api/upload.ashx");xhr.send(fd);

<iframe name="html4-upload-target"></iframe><form action="api/upload.ashx" method="post" enctype="multipart/form-data" target="html4-upload-target">    <input type="file" name="upfile" /></form>

//iframe load 事件//注意：低版本 ie 支持 iframe 的 onl oad 事件,不过是隐形的(iframe.onload 方式绑定的将不会触发),需要通过 attachEvent 来注册function bind_iframe_load(iframe, fn) {    if (iframe.attachEvent) iframe.attachEvent("onload", fn);    else iframe.addEventListener("load", fn, false);}//html4上传完成回调bind_iframe_load(iframe, function () {    //获取服务器响应    var text = iframe.contentWindow.document.body.innerHTML;});

<!-- 上传按钮，样式随自己控制，假设宽高为分别为120px,36px，相对于body的边距分别为100px,100px --><a class="upload-target">选择文件上传</a><!-- 上传控件，选择文件后（change事件）将 input 追加到 form 即可 --><div style="width:120px;height:36px;position:absolute;left:100px;top:100px;overflow:hidden;filter: alpha(opacity=0);opacity:0;">    <input type="file" name="upfile" style="width:120px;height:36px;font-size:100px;" /></div>

<div id="drop-area">将文件拖拽到此区域</div>

var boxDropArea = $("#drop-area")[0];//TODO:检测支持情况//阻止浏览器默认拖放行为$(boxDropArea).on("dragleave dragenter drop dragover", function (e) {    e.preventDefault();    e.stopPropagation();});//获取拖拽的文件对象并上传$(boxDropArea).on("drop", function (e) {    var files = e.dataTransfer.files;    if (!files || files.length == 0) return;    for (var file in files) {        //TODO:上传文件        upload(file);    }});

var uploader = new Q.Uploader({    url: "api/upload.ashx?type=file",    target: document.getElementById("upload-target"),    view: document.getElementById("upload-view"),    //html5: true,       //是否启用html5上传，默认为true    //multiple: true,    //是否允许多选(仅html5模式有效)，默认为true    //auto: true,        //添加任务后是否立即上传，默认为true        //允许或不允许上传的文件类型 (allows 与 disallows 可单一或组合使用)    //allows: ".txt,.jpg,.png,.gif,.zip,.rar,.7z",    //disallows:".exe"    //每次上传都会发送的参数(POST方式)    data: { user: "Devin" }});