1 appendTo
function exportIssue() {
var planId = $('#planId').val();
var url = prefixUrl + '/exportReport';
// 模拟表单,来完成文件流的传输
var form = $("<form></form>").attr("action", url).attr("method", "post");
form.append($("<input></input>").attr("type", "hidden").attr("name", "planId").attr("value", planId));
form.append($("<input></input>").attr("type", "hidden").attr("name", "selectTitle").attr("value", selectTitle));
form.append($("<input></input>").attr("type", "hidden").attr("name", "tabFlag").attr("value", getSplitTableType()));
form.appendTo('body').submit().remove();
}
2 download.js
data 为key-value 的 json 数据
// Ajax 文件下载
$.download = function(url, data){ // 获得url和data
var inputs = '';
$.each(data, function(name, value) {
inputs+='<input type="hidden" name="'+ name +'" value="'+ value +'" />';
});
$('<form action="'+ url +'" method="post">'+inputs+'</form>')
.appendTo('body').submit().remove();
};
3 fun
function postExcelFile(params, url) {
// { fun:'select',gdlb:'submit',selectId: selectId },
//params是post请求需要的参数，url是请求url地址
var form = document.createElement("form");
form.style.display = "none";
form.action = url;
form.method = "post";
document.body.appendChild(form);
// 动态创建input并给value赋值
for (var key in params) {
var input = document.createElement("input");
input.type = "hidden";
input.name = key;
input.value = params[key];
form.appendChild(input);
}
form.submit();
form.remove();
}
form表单提交
为一个下载按钮添加click事件，点击时动态生成一个表单，利用表单提交的功能来实现文件的下载
/**
* 下载文件
* @param {String} path - 请求的地址
* @param {String} fileName - 文件名
*/
function downloadFile (downloadUrl, fileName) {
// 创建表单
const formObj = document.createElement('form');
formObj.action = downloadUrl;
formObj.method = 'get';
formObj.style.display = 'none';
// 创建input，主要是起传参作用
const formItem = document.createElement('input');
formItem.value = fileName; // 传参的值
formItem.name = 'fileName'; // 传参的字段名
// 插入到网页中
formObj.appendChild(formItem);
document.body.appendChild(formObj);
formObj.submit(); // 发送请求
document.body.removeChild(formObj); // 发送完清除掉
}