为什么 JQuery 不能设置锚点“下载”属性值？答案

【问题标题】：Why can't JQuery set anchor "download" attribute value?为什么 JQuery 不能设置锚点“下载”属性值？
【发布时间】：2015-11-13 06:50:38
【问题描述】：

我正在尝试动态设置锚点下载属性的值。这应该是下载文件的文件名。但是，文件名默认为其原始值，而不是我试图给它的值。

编辑： 有人指出，下载属性值实际上在 DOM 中发生了变化。但是，下载的文件的文件名没有正确分配。

编辑：动态设置值似乎不是问题。即使是硬编码，文件名也没有设置。

<a href="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" download="image.png">click</a>

http://jsfiddle.net/abalter/2wz5zs7r/

HTML：

<button>Set url and download name for anchor</button>
<a href="" download="">Download Google logo</a>

Javascript：

var googleLogoURL = "https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png"; 
$('button').on('click', function(){
    alert("url and filename set");
    $('a').prop({
        'href': googleLogoURL,
        'download': "google-logo.png"
    });
});

【问题讨论】：

确实设置好了。如果你打开开发者工具，你会看到它变成了<a href="https://..." download="google-logo.png">Download Google Logo</a>。
@YeldarKurmangaliyev 很好的观察。问题是当您单击下载链接时，下载的文件的文件名是错误的——没有改变。我正在编辑我的帖子以澄清这一点。
有什么理由不使用window.location.href 吗？ stackoverflow.com/questions/1296085/download-file-using-jquery
这不允许我设置下载文件的文件名。此外，新的 HTML5 属性应该是执行此操作的“新”方式。
使用 Firebug 在 FireFox 中测试，我可以看到 a 的 DOM“下载”更新为 "google-logo.png"。它仍会尝试另存为错误的名称。所以不确定浏览器在哪里提取该信息。

标签： javascript jquery html download anchor

【解决方案1】：

它不起作用，因为您运行 JS 的网页可能不是托管在 https://www.google.com 上。

来自the HTML 5 spec：

在跨域情况下，下载属性必须与 Content-Disposition HTTP 标头（特别是附件处置类型）结合使用，以避免警告用户可能存在恶意活动。（这是为了防止用户在没有完全理解的情况下下载敏感的个人或机密信息。）

来自MDN：

此属性仅适用于指向同源资源的链接。

【讨论】：