码迷,mamicode.com
首页 > 其他好文 > 详细

实现文件下载请等待提示

时间:2016-12-12 15:33:23      阅读:289      评论:0      收藏:0      [点我收藏+]

标签:实现文件下载请等待提示   ajax实现文件下载   请等待提示   

ajax实现下载等待

该方法先发一个请求到后台去生成Excel,并把生成的Excel文件保存在服务器上的临时文件夹。然后通过ajax返回Excel文件在服务器上的路径或者文件标记。ajax客户端收到服务器返回的结果,再通过iframe或者form发起请求去下载Excel文件。这个方法需要客户端发两次请求到后台,第一次是请求后台生成Excel文件,第二次是请求下载Excel文件。 这个方法不存在任何兼容性以及限制,推荐使用。

<script type="text/javascript" src=\‘#\‘" /js/jquery.blockUI.js" encode="false"/>"></script>
 <a href="#" class="w120" onclick="form_download(‘<s:url value="/mng_usr!download" />‘); return false;">下载</a>
function form_download(url) {
    if (window.confirm(‘确定下载吗?‘)) {
    var imgUrl="http://localhost:8080/admin/images/indicator.gif";
    $.blockUI({
            message: ‘<div><img src="‘+imgUrl+‘" style="margin-right:5px;"  />データ取得中…</div>‘,
            css: {
                padding:‘25px‘
            }
        });
    var form = $("<form name=‘formDownload‘ id=‘formDownload‘></form>"); 
    form.attr(‘method‘, ‘post‘);
    form.attr(‘action‘, url);
    $(‘body‘).append(form); 
    form.submit();
    $.ajax({
    url:url,
    cache:false,
    data:{},
    dataType : "json",
    contentType : "application/json:charset=utf-8",
    success:function (data){
    $.unblockUI();
    },
    error:function(e){
    $.unblockUI();
    }
    }); 
    }
}

iframe实现下载等待

用iframe实现下载等待的原理是把下载的路径给iframe的src,然后监听iframe的onload事件,当后台处理完成并返回文件时,会触发iframe的onload事件。使用该方法有两个问题:

参数通过url传递,如果url长度超过2048会被浏览器截断。

iframe的onload事件在ie浏览器下触发不符合要求。

 参考:

http://blog.csdn.net/accountwcx/article/details/46728563

1. 使用ajax,ajax的返回值类型是json,text,html,xml类型,或者可以说ajax的发送,接受都只能是string字符串,不能流类型,所以无法实现文件下载,强用会出现response冲突。如果非要使用ajax的话,只能通过返回值得到生成的文件相关url。然后在回调函数里通过创建一个iframe,并设置其src值为文件url,或者一个对文件生成流的处理url,这样操作来实现文件下载且页面无刷新。

有参数传递的情况

var title=$("input[name=‘gjzSelect‘]").val();
var rqTime = $(".ui-datepicker-time").val();
var ddd= rqTime.split("一");
var startTime=ddd[];
var endTime=ddd[];
var form = $("<form></form>"); //定义一个form表单
form.attr(‘style‘, ‘display:none‘); //在form表单中添加查询参数
form.attr(‘target‘, ‘‘);
form.attr(‘method‘, ‘post‘);
form.attr(‘action‘, "<%=basePath%>jiankong/madeExcel.do");
var input = $(‘<input>‘);
input.attr(‘type‘, ‘hidden‘);
input.attr(‘name‘, ‘startTime‘);
input.attr(‘value‘, startTime);
var input = $(‘<input>‘);
input.attr(‘type‘, ‘hidden‘);
input.attr(‘name‘, ‘endTime‘);
input.attr(‘value‘, endTime);
var input = $(‘<input>‘);
input.attr(‘type‘, ‘hidden‘);
input.attr(‘name‘, ‘title‘);
input.attr(‘value‘, title);
$(‘body‘).append(form); //将表单放置在web中
form.append(input); //将查询参数控件提交到表单上
form.append(input);
form.append(input);
form.submit();
<%-- 
$.ajax({
url:‘<%=basePath%>jiankong/madeExcel.do‘,
cache:false,
data:{
‘startTime‘:startTime,
‘endTime‘:endTime,
‘title‘ :title
},
error:function (e){
alert("导出失败!");
},
success:function (data){
alert("导出成功!");
} 
}); 
--%>


本文出自 “10916470” 博客,请务必保留此出处http://10926470.blog.51cto.com/10916470/1881817

实现文件下载请等待提示

标签:实现文件下载请等待提示   ajax实现文件下载   请等待提示   

原文地址:http://10926470.blog.51cto.com/10916470/1881817

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!