jquery文件下载
jQuery实现文件下载的方法
通过jQuery实现文件下载有多种方式，以下是常见的几种方法：
使用window.location或window.open 直接通过JavaScript跳转到文件URL触发下载：
$('#downloadBtn').click(function() {
window.location.href = '/path/to/file.pdf';
// 或使用window.open
// window.open('/path/to/file.pdf', '_blank');
});创建隐藏的iframe元素 这种方式不会导致页面跳转：
$('#downloadBtn').click(function() {
$('<iframe>', {
src: '/path/to/file.pdf',
style: 'display:none'
}).appendTo('body');
});使用AJAX下载（适合需要鉴权的场景） 当需要发送认证信息时可以使用此方法：
$('#downloadBtn').click(function() {
$.ajax({
url: '/path/to/file.pdf',
method: 'GET',
xhrFields: {
responseType: 'blob'
},
success: function(data) {
var a = document.createElement('a');
var url = window.URL.createObjectURL(data);
a.href = url;
a.download = 'filename.pdf';
document.body.appendChild(a);
a.click();
setTimeout(function() {
document.body.removeChild(a);
window.URL.revokeObjectURL(url);
}, 0);
}
});
});动态创建下载链接
$('#downloadBtn').click(function() {
var link = document.createElement('a');
link.href = '/path/to/file.pdf';
link.download = 'custom-filename.pdf';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
});注意事项
- 确保服务器正确设置了文件MIME类型和Content-Disposition头
- 跨域下载需要服务器配置CORS策略
- 大文件下载建议使用直接链接方式而非AJAX
- 某些浏览器可能限制程序化触发的下载行为
服务端配合
服务器应设置正确的响应头以触发下载而非直接显示：
Content-Type: application/octet-stream
Content-Disposition: attachment; filename="filename.ext"以上方法可根据具体需求场景选择使用，其中AJAX方式适合需要额外处理下载逻辑的情况，而简单下载使用直接链接方式即可。
