网页无刷新下载文件

最新推荐文章于 2022-10-02 21:50:58 发布

weixin_34352449

最新推荐文章于 2022-10-02 21:50:58 发布

阅读量170

点赞数

原文链接：https://my.oschina.net/u/2321816/blog/599237

版权

2019独角兽企业重金招聘Python工程师标准>>>

网页无刷新下载文件，有三种方式。这里只记录一种，能达到效果就可以了——利用操作DOM动态创建form表单，和在form表单中创建隐藏域的方式提交表单，进行无刷新下载。

前端利用Jquery来进行对DOM操作。下面直接上代码：

       //下文excel文件 ,利用动态生成一个form表单的形式,下载
	$("#download").click(function(){
		var form=$('<form id="downloadForm">');//定义一个form表单
		form.attr("style","display:none");
		form.attr("target","");
		form.attr("method","post");
			
		var input=$("<input>");    //定义一个隐藏域，设置你要上传的参数的name和value
		input.attr("type","hidden");
		input_yearMonth.attr("name","yearMonth");
		input_yearMonth.attr("value",_yearMonth);
		$("body").append(form);//将表单放置在web中
		form.append(input);
		
		form.submit();//表单提交 
		$("#downloadForm").remove();  //删除表单，防止用户多次提交下载，不断生成相同form代码。
	});

服务器端需要定义返回头

response.reset();  
//解决Content-disposition filename中不能使用中文名的方法。filename 和 filename*来解决跨浏览器中文名问题
String filename = yearMonth + URLEncoder.encode("订单数据详情表（"+barberName+"）","UTF-8")+".xls";
response.setHeader("Content-disposition","attachment;filename="+filename+";filename*="+filename);  
response.setContentType("application/msexcel");  //我这里是下载excel文件。

就到这里了。

PS：顺便推广下我正在使用javaWeb框架：Nutz，一个比SSH更好用的框架。http://www.nutzam.com/

转载于:https://my.oschina.net/u/2321816/blog/599237