为什么不能在以下演示中打开链接:http :
//html5-demos.appspot.com/static/a.download.html
您甚至无法右键单击并在新的选项卡/窗口中打开它。我需要自定义浏览器中的任何设置吗?
为什么不能在以下演示中打开链接:http :
//html5-demos.appspot.com/static/a.download.html
您甚至无法右键单击并在新的选项卡/窗口中打开它。我需要自定义浏览器中的任何设置吗?
download
IE和Safari不支持该属性。但是我不会下载/保存该链接:正如我的问题标题中所述,它甚至都不会打开/导航到该链接。Safari可以正常工作。这是一个没有下载属性的演示。
Answers:
由于安全限制,此演示使用IE不支持的Blob URL。
IE有自己的API,用于创建和下载文件msSaveOrOpenBlob
。
这是适用于IE,Chrome和Firefox的跨浏览器解决方案:
function createDownloadLink(anchorSelector, str, fileName){
if(window.navigator.msSaveOrOpenBlob) {
var fileData = [str];
blobObject = new Blob(fileData);
$(anchorSelector).click(function(){
window.navigator.msSaveOrOpenBlob(blobObject, fileName);
window.navigator.msSaveOrOpenBlob(blobObject, fileName);
});
} else {
var url = "data:text/plain;charset=utf-8," + encodeURIComponent(str);
$(anchorSelector).attr("download", fileName);
$(anchorSelector).attr("href", url);
}
}
$(function () {
var str = "hi,file";
createDownloadLink("#export", str, "file.txt");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="export" class="myButton" download="" href="#">export</a>
这是将任何文件下载为Blob的功能。(在IE和非IE上测试)
var download_csv_using_blob = function (file_name, content) {
var csvData = new Blob([content], { type: 'text/csv' });
if (window.navigator && window.navigator.msSaveOrOpenBlob) { // for IE
window.navigator.msSaveOrOpenBlob(csvData, file_name);
} else { // for Non-IE (chrome, firefox etc.)
var a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
var csvUrl = URL.createObjectURL(csvData);
a.href = csvUrl;
a.download = file_name;
a.click();
URL.revokeObjectURL(a.href)
a.remove();
}
};
注意:如果需要,请更改文件的类型。
URL.revokeObjectURL(a.href)
如果数据来自Ajax,则可以添加
if (window.navigator.msSaveOrOpenBlob)
xhttp.responseType = "arraybuffer";
else
xhttpGetPack.responseType = "blob";
/////////////////////////////////////////////////////
var a = document.createElement("a");
document.body.appendChild(a);
a.style.display = "none";
// IE
if (window.navigator.msSaveOrOpenBlob)
{
a.onclick = ((evx) =>
{
var newBlob = new Blob([new Uint8Array(xhttpGetPack.response)]);
window.navigator.msSaveOrOpenBlob(newBlob, "myfile.ts");
});
a.click();
}
else //Chrome and safari
{
var file = URL.createObjectURL(xhttpGetPack.response);
a.href = file;
a["download"] = "myFile.ts";
a.click();
window.URL.revokeObjectURL(file);
}
//File Object return in ajax Success in data variable
var blob = new Blob([data]);
if (navigator.appVersion.toString().indexOf('.NET') > 0) //For IE
{
window.navigator.msSaveOrOpenBlob(blob, "filename.ext");
}
else if (navigator.userAgent.toLowerCase().indexOf('firefox') >-1)
{
var link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = "filename.ext";
document.body.appendChild(link);//For FireFox <a> tag event
//not working
link.click();
}
else
{
var link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = "filename.ext"
link.click();
}