前端- html <a> 標籤，屬性中的download ，無法下載圖片，變成檢視圖片

19110

发布于
2018-04-09

更新于
2018-04-11

<p>下載圖片</p>
以下是我裡面下的屬性
href="http://blog.accupass.com/wpcontent/uploads/2017/03/1_120122230539_1.jpg"
download
target="_blank"

當我直接按下連結
會另開視窗變成檢視圖片
如果我按著鍵盤的command 再點連結就會是下載圖片
請問是我哪裡寫錯了嗎

前端

html5 html

阅读 4.2k

4 个回答

ycloud

✓ 已被采纳

注意:
此属性仅适用于同源 URLs。
可以使用 blob: URLs 和 data: URLs 以方便用户下载 JavaScript 方式生成的内容（例如使用在线绘图的Web应用创建的照片）。
如果HTTP头的Content-Disposition：存在，并且赋予了一个和这个属性不同的文件名，HTTP头优先于此属性。
如果这个属性存在 Content-Disposition 被设置为 inline，火狐优先 Content-Disposition，像之前文件名的情况下，而Chrome则优先 download 属性。

参考：https://developer.mozilla.org...

浏览器的同源策略
https://developer.mozilla.org...

demo:
https://jsfiddle.net/ycloud/f...

http://www.w3school.com.cn/ti...
可以去看一下

点击下载！

angel_郁

1.1k1621

发布于
2018-04-11

给你个案例

<!DOCTYPE html>
<html>
<body>

<p>点击 W3School 的 logo 来下载该图片：<p>

<a href="http://www.w3school.com.cn/i/w3school_logo_white.gif" download="w3logo">
<img border="0" src="http://www.w3school.com.cn/i/w3school_logo_white.gif" alt="W3School">
</a>

</body>
</html>

要注意A标签的 download属性要等于一个值（下载的文件名） download="w3logo"