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

V2EX = way to explore

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

For Existing Member Sign In

• 请不要在回答技术问题时复制粘贴 AI 生成的内容

This topic created in 3348 days ago, the information mentioned may be changed or developed.

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

禁止

拖拽

火狐

图片

14 replies • 2017-03-14 00:29:18 +08:00

SakuraKuma

Mar 10, 2017

pointer-events: none

zzetao

Mar 10, 2017

把图片设置为 background

fytriht

Mar 10, 2017 via Android

用 canvas 也行

congeec

Mar 10, 2017 via iPhone

做成单贞 vodeo 呢？

Neo

Mar 11, 2017

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

lrz0lrz

Mar 11, 2017

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

tgxh

Mar 11, 2017 via Android

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

Neo

Mar 11, 2017

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

Ncanback

Mar 11, 2017

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

dangyuluo

Mar 12, 2017 via iPhone

背景图得了，或者 canvas

blessme

Mar 12, 2017

直接审查元素下载

wuling

Mar 12, 2017

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

zhuscat

Mar 12, 2017

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

leekafai

Mar 14, 2017 via Android

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