如何禁止用户右键直接下载图片及相关的一些默认事件

2019-07-28 20:28:17

需求说明:

有时候,我们网站的图片资源为收费资源,所以在下载之前都是有一定需求的

但是浏览器本身却有一个 “ 右键 另存为 ” 的功能


禁止鼠标右键保存图片

<img src=“logo.png” width=“150” height=“150” οncοntextmenu=“return false;”>


扩展:


禁止鼠标拖动图片

<img src=“logo.png” width=“150” height=“150” οndragstart=“return false;”>


文字禁止鼠标选中

<p onselectstart=“return false;”>文字禁止鼠标选中</p>

<p>普通文字可以选中</p>


禁止复制文本

<p οnselect=“document.selection.empty();”>禁止复制文本</p>

<p>普通文字可以复制</p>


  • 2020-03-03 09:51:38

    写一个可插入自定义标签的 Textarea 组件

    为了实现这个功能,我最先想的是改造一个 <textarea> 然后我想到了 contenteditable (链接指向 mozilla.org) 这一属性 这是一个 html5 的属性,可以让元素内容可编辑

  • 2020-03-03 20:18:21

    Vuepress如何做到在 Markdown 中使用 Vue 语法

    在 vuepress 刚出时,我就觉得这是个很值得追更的开源项目。果不其然,里面众多的前端编程技巧让我受益良多。 于是在周末这种日子里,人家追剧我追码。 今天,我就和大家分享下 vuepress 是如何做到在 Markdown 中使用 Vue 语法的。

  • 2020-03-03 21:35:57

    PWA:安装 Web 应用

    要完整介绍 PWA 是什么,需要扯一堆名词,毫无意义。 以改造公羊阅读的过程为例,简要的说明什么是 PWA。

  • 2020-03-04 13:00:23

    NPM酷库:minimist,命令行参数解析

    昨天我们了解的dotenv库用于从文件中加载环境变量。环境变量用于程序运行时动态加载参数,除了环境变量,我们还可以在启动Node.js 程序时直接指定命令行参数: