JavaScript禁止右击保存图片,禁止拖拽图片的实现代码


Posted in Javascript onApril 28, 2020

下面先看下js禁止右击保存图片。

禁止鼠标右键保存图片

<img src="" oncontextmenu="return false;">

禁止鼠标拖动图片

<img src="" ondragstart="return false;">

文字禁止鼠标选中

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

禁止复制文本

<p onselect="document.selection.empty();">文字禁止鼠标选中</p>

jquery禁止文本复制和拷贝

$(document).bind("contextmenu copy selectstart", function() {
   return false;
});

jquery禁止图片拖拽

var img=$("img");
img.on("contextmenu",function(){return false;});
img.on("dragstart",function(){return false;});

ps:js保存图片到手机相册

/保存到相册
function savePic(){     
  var picurl= $("#picurl").attr("src");
  //alert(picurl);
  savePicture(picurl);
}
var triggerEvent = "touchstart";
function savePicture(Url){
  var blob=new Blob([''], {type:'application/octet-stream'});
  var url = URL.createObjectURL(blob);
  var a = document.createElement('a');
  a.href = Url;
  a.download = Url.replace(/(.*\/)*([^.]+.*)/ig,"$2").split("?")[0];
  var e = document.createEvent('MouseEvents');
  e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
  a.dispatchEvent(e);
  URL.revokeObjectURL(url);
}

到此这篇关于JavaScript禁止右击保存图片,禁止拖拽图片的实现代码的文章就介绍到这了,更多相关js 禁止右击保存图片拖拽图片内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
js+css使DIV始终居于屏幕中间 左下 左上 右上 右下的代码集合
Mar 10 Javascript
JavaScript 用cloneNode方法克隆节点的代码
Oct 15 Javascript
浅析LigerUi开发中谨慎载入common.css文件
Jul 09 Javascript
JQuery判断子iframe何时加载完成解决方案
Aug 20 Javascript
jQuery 复合选择器应用的几个例子
Sep 11 Javascript
jQuery中的一些常见方法小结(推荐)
Jun 13 Javascript
简单实现的JQuery文本框水印插件
Jun 14 Javascript
vue 和vue-touch 实现移动端左右导航效果(仿京东移动站导航)
Apr 22 Javascript
vue使用技巧及vue项目中遇到的问题
Jun 04 Javascript
vue调试工具vue-devtools安装及使用方法
Nov 07 Javascript
基于Vue中使用节流Lodash throttle详解
Oct 30 Javascript
三种方式清除vue路由跳转router-link的历史记录
Apr 10 Vue.js
JavaScript 禁止用户保存图片的实现代码
Apr 28 #Javascript
JS求解两数之和算法详解
Apr 28 #Javascript
jQuery插件simplePagination的使用方法示例
Apr 28 #jQuery
uni-app如何页面传参数的几种方法总结
Apr 28 #Javascript
JavaScript 双向链表操作实例分析【创建、增加、查找、删除等】
Apr 28 #Javascript
JS 创建对象的模式实例小结
Apr 28 #Javascript
JavaScript console的使用方法实例分析
Apr 28 #Javascript
You might like
c#中的实现php中的preg_replace
2009/12/21 PHP
PHP实现把文本中的URL转换为链接的auolink()函数分享
2014/07/29 PHP
PHP单态模式简单用法示例
2016/11/16 PHP
jquery DOM操作 基于命令改变页面
2010/05/06 Javascript
JavaScript高级程序设计阅读笔记(六) ECMAScript中的运算符(二)
2012/02/27 Javascript
Jquery中LigerUi的弹出编辑框(实现方法)
2013/07/09 Javascript
JavaScript的递归之递归与循环示例介绍
2013/08/05 Javascript
js格式化时间和js格式化时间戳示例
2014/02/10 Javascript
jquery弹窗插件colorbox绑定动态生成元素的方法
2014/06/20 Javascript
jquery使用$(element).is()来判断获取的tagName
2014/08/24 Javascript
Windows 系统下设置Nodejs NPM全局路径
2016/04/26 NodeJs
jquery基本选择器匹配多个元素的实现方法
2016/09/05 Javascript
Bootstrap实现带暂停功能的轮播组件(推荐)
2016/11/25 Javascript
Angular.JS去掉访问路径URL中的#号详解
2017/03/30 Javascript
JS简单获取日期相差天数的方法
2017/04/24 Javascript
详解Vue中过度动画效果应用
2017/05/25 Javascript
javascript+html5+css3自定义弹出窗口效果
2017/10/26 Javascript
详解React 的几种条件渲染以及选择
2018/10/23 Javascript
Vue2.x通用条件搜索组件的封装及应用详解
2019/05/28 Javascript
微信小程序身份证验证方法实现详解
2019/06/28 Javascript
[02:57]2014DOTA2国际邀请赛-观众采访
2014/07/19 DOTA
python爬取网站数据保存使用的方法
2013/11/20 Python
Python实现周期性抓取网页内容的方法
2015/11/04 Python
Python实现pdf文档转txt的方法示例
2018/01/19 Python
Python 数据库操作 SQLAlchemy的示例代码
2019/02/18 Python
python查询文件夹下excel的sheet名代码实例
2019/04/02 Python
Python面向对象思想与应用入门教程【类与对象】
2019/04/12 Python
Python生成rsa密钥对操作示例
2019/04/26 Python
python3 动态模块导入与全局变量使用实例
2019/12/22 Python
HTML5+WebSocket实现多文件同时上传的实例
2016/12/29 HTML / CSS
美国健康和保健平台:healtop
2020/07/02 全球购物
一名女生的自荐信
2013/12/08 职场文书
网络研修随笔感言
2014/02/17 职场文书
教师党员公开承诺书
2014/03/25 职场文书
MYSQL主从数据库同步备份配置的方法
2021/05/26 MySQL
sql注入教程之类型以及提交注入
2021/08/02 MySQL