javascript - Anchor 的下载属性在某些页面 (Gmail) 上不起作用?

标签 javascript html csv download anchor

我想在一些页面中插入这个 HTML 元素:

<a download="somedata.csv"
   id="downloadLink"
   href="data:application/csv;charset=utf-8,Col1%2CCol2%2CCol3%0AVal1%2CVal2%2CVal3%0AVal11%2CVal22%2CVal33%0AVal111%2CVal222%2CVal333"
>
    Click Me
</a>

在所有页面中,当我通过插件或在元素检查器中手动更改 dom 以将此元素包含到页面的 dom 中时,效果很好!
但是,如果我在 Gmail 页面中执行相同的操作,生成的文件不会命名为“somedata.csv”并且扩展名会丢失“csv”!

我在本地文件、上传到本地主机的文件以及许多外部网站页面中都试过了,它在除 Gmail 页面之外的所有页面中都有效。

为什么它在 Gmail 页面中不起作用?以及如何解决这个问题?

最佳答案

对于那些感兴趣的人,我使用 Javascript/Ajax 解决了它,这里是解决方案:

函数如下:

var downloadDataURI = function($, options) {
    if(!options)
        return;
    $.isPlainObject(options) || (options = {data: options});
    if(!$.browser.webkit) 
        window.location = options.data;
    options.filename || (options.filename = "download." + options.data.split(",")[0].split(";")[0].substring(5).split("/")[1]);
    options.url || (options.url = "http://download-data-uri.appspot.com/");
    $('<form method="post" action="'+options.url+'" style="display:none"><input type="hidden" name="filename" value="'+options.filename+'"/><input type="hidden" name="data" value="'+options.data+'"/></form>').submit().remove();
}

下面是如何调用它:

downloadDataURI($, {filename: "test.csv",data:"data:application/csv;charset=utf-8,Col1%2CCol2%2CCol3%0AVal1%2CVal2%2CVal3%0AVal11%2CVal22%2CVal33%0AVal111%2CVal222%2CVal333"});

关于javascript - Anchor 的下载属性在某些页面 (Gmail) 上不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13912198/

相关文章:

javascript - 复选框的多维数组?

html - 在网络浏览器上显示 UTF-16 字符

javascript - 通过添加 eventListener 取消 Canvas 动画

javascript - 不使用 javascript 从输入字段中检索值以进行数据库插入

javascript - 如何使用 Ember.Select 值过滤 JSON?

html - 使用盒子阴影制作斜 Angular 效果

Python - 如何保存具有不同文件名的CSV文件?

Python 多核 CSV 短程序,需要建议/帮助

java - 使用与时间相对应的 Csv 文件获取奇怪的输出

javascript - 如何让我的 vert.x 进程退出