如何用 js 实现禁止图片下载

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 2810 天前的主题，其中的信息可能已经有所发展或是发生改变。

项目开发中，有拖拽图片的事件，发现在火狐浏览器上，拖拽图片后松开鼠标会实现图片自动下载，用 js 有什么办法能禁止掉该功能，但也不能把拖拽事件禁止（不是在火狐里面禁止，直接用 js 帮用户禁止掉），新手求各位大神指点

禁止

拖拽

火狐

图片

14 条回复 • 2017-03-14 00:29:18 +08:00

SakuraKuma

2017-03-10 17:54:24 +08:00

pointer-events: none

zzetao

2017-03-10 21:09:57 +08:00

把图片设置为 background

fytriht

2017-03-10 21:22:06 +08:00 via Android

用 canvas 也行

congeec

2017-03-10 22:24:42 +08:00 via iPhone

做成单贞 vodeo 呢？

Neo

2017-03-11 08:30:56 +08:00

既然要放网上，就别去费时间防这防那的

lrz0lrz

2017-03-11 10:08:08 +08:00

@Neo #5 你可能没看懂楼主的需求，拖动图片时，浏览器会默认弹出下载框，楼主想要阻止弹出这个下载框

tgxh

2017-03-11 10:55:40 +08:00 via Android

Firefox51 ，同问这个问题的火狐禁止方法

Neo

2017-03-11 12:21:11 +08:00

@lrz0lrz 这也是前端的问题，不是火狐的锅， z-index 把图片放下面一层就行了，需要相应的层放图片上面

Ncanback

2017-03-11 16:33:23 +08:00

设置成 background-image 或者做一个透明 div 层级覆盖 img

dangyuluo

2017-03-12 00:00:22 +08:00 via iPhone

背景图得了，或者 canvas

blessme

2017-03-12 15:46:05 +08:00

直接审查元素下载

wuling

2017-03-12 17:47:27 +08:00

又一个描述不清的帖子。楼主的意思是，项目中要用到图片拖拽事件，但 Firefox 对于拖拽事件的默认行为是下载，所以冲突了。楼主想禁掉 Firefox 的下载行为，自定义处理拖拽事件，而不是为了真的防止用户盗图

zhuscat

2017-03-12 18:24:04 +08:00

用 Drag API 应该就行了吧，取消掉默认行为。

leekafai

2017-03-14 00:29:18 +08:00 via Android

不要让鼠标能直接拖动图片，而应该让鼠标拖动图片上层的 div ，然后 js 接管你需要的拖动事务。