前端实现页面无刷新 文件上传下载

上传：

　　1.html5 的FormData对象实现

　　

var fd = new FormData(document.getElementById("fileinfo"));
fd.append("CustomField", "This is some extra data");
$.ajax({
  url: "stash.php",
  type: "POST",
  data: fd,
  processData: false,  // 告诉jQuery不要去处理发送的数据
  contentType: false   // 告诉jQuery不要去设置Content-Type请求头
});

　　浏览器支持情况：　　　　

　　参考链接：

　　　　API:https://developer.mozilla.org/en-US/docs/Web/API/FormData

　　　　http://itindex.net/blog/2012/04/14/1334367483953.html

　　　　http://ileson.iteye.com/blog/2099761

　　　　http://www.oschina.net/code/snippet_200893_26533

　　2.iframe 把url给iframe的src属性

　　3.flash

下载：

　　如果是excel, word之类的可以直接用<a href="http://xxxx" ></a>实现下载

　　如果是图片的话，采用以上方法会跳转，所以也会用iframe来实现，类似以下这样：

_handleDownload: function(){
        document.getElementById("ifile").src="http://localhost:8000/av1.png";
    },　　

<a href="javascript:void(0)" onClick={_self._handleDownload}>下载</a>

 

<iframe id="myFrameId" name="myFrameName" scrolling="no" frameborder="0" style="width:200px; height:150px; "></iframe>
2 <a href="../ashx/Print2DCodeImage.ashx?codeInfo=Demo123" target="myFrameName" >打印二维码</a>

 　 另外，下载是弹出"另存为"对话框还是直接开始下载，是浏览器的设置。如chrome设置：设置-->显示高级设置->下载内容，勾选“下载前询问每个文件的保存位置”，那么点下载会弹出"另存为"对话框"

　　

　　引用

　　　　要直接下载一个文件，我们需要做两件事，第一件事是：设定响应的内容类为“application/octet-stream”，大小写无关。第二件事是：设置HTTP的响应头名字为：Content-Disposition，设定值为：attachment; filename = theFileName。这里的　　　    　　  theFileName就是出现在文件下载对话框里的默认文件名，通常和所下载的文件名字相同，但也可以不同。

　　参考链接：http://blog.csdn.net/dongzhouzhou/article/details/8476526