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 相关文章推荐
jQuery插件原来如此简单 jQuery插件的机制及实战
Feb 07 Javascript
js判断上传文件后缀名是否合法
Jan 28 Javascript
使用基于Node.js的构建工具Grunt来发布ASP.NET MVC项目
Feb 15 Javascript
javascript HTML5 Canvas实现圆盘抽奖功能
Apr 11 Javascript
AngularJS包括详解及示例代码
Aug 17 Javascript
bootstrap按钮插件(Button)使用方法解析
Jan 13 Javascript
利用Vue.js+Node.js+MongoDB实现一个博客系统(附源码)
Apr 24 Javascript
EasyUI实现下拉框多选功能
Nov 07 Javascript
JS实现碰撞检测的方法分析
Jan 19 Javascript
深入浅析Vue中的Prop
Jun 10 Javascript
JQuery通过后台获取数据遍历到前台的方法
Aug 13 jQuery
js实现带有动画的返回顶部
Aug 09 Javascript
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
VFP与其他应用程序的集成
2006/10/09 PHP
完美解决phpexcel导出到xls文件出现乱码的问题
2016/10/29 PHP
thinkPHP框架对接支付宝即时到账接口回调操作示例
2016/11/14 PHP
Javascript this 的一些学习总结
2012/08/31 Javascript
滚动图片效果 jquery实现回旋滚动效果
2013/01/08 Javascript
javaScript实现浮点数转十六进制字符
2013/10/29 Javascript
JavaScript关闭当前页面(窗口)不带任何提示
2014/03/26 Javascript
JS 新增Cookie 取cookie值 删除cookie 举例详解
2014/10/10 Javascript
在JavaScript中操作数组之map()方法的使用
2015/06/09 Javascript
深入解读JavaScript中的Hoisting机制
2015/08/12 Javascript
解决JS内存泄露之js对象和dom对象互相引用问题
2017/06/25 Javascript
React Native悬浮按钮组件的示例代码
2018/04/05 Javascript
vue2.0 实现富文本编辑器功能
2019/05/26 Javascript
JavaScript设计模式---单例模式详解【四种基本形式】
2020/05/16 Javascript
el-form 多层级表单的实现示例
2020/09/10 Javascript
[09:43]DOTA2每周TOP10 精彩击杀集锦vol.5
2014/06/25 DOTA
python k-近邻算法实例分享
2014/06/11 Python
详解python中sort排序使用
2019/03/23 Python
解决pytorch-yolov3 train 报错的问题
2020/02/18 Python
Selenium 滚动页面至元素可见的方法
2020/03/18 Python
python自动脚本的pyautogui入门学习
2020/04/01 Python
Python opencv相机标定实现原理及步骤详解
2020/04/09 Python
使用python matplotlib 画图导入到word中如何保证分辨率
2020/04/16 Python
简单了解python shutil模块原理及使用方法
2020/04/28 Python
英国领先的电动可调床制造商:Laybrook
2019/12/26 全球购物
周年庆典邀请函范文
2014/01/24 职场文书
通信研究生自荐信
2014/02/01 职场文书
女娲补天教学反思
2014/02/05 职场文书
初中学生操行评语
2014/12/26 职场文书
单位介绍信格式
2015/01/31 职场文书
学习雷锋精神活动总结
2015/02/06 职场文书
公司文体活动总结
2015/05/07 职场文书
表扬稿表扬信的格式及范文
2019/06/24 职场文书
Pytorch 统计模型参数量的操作 param.numel()
2021/05/13 Python
使用Redis实现分布式锁的方法
2022/06/16 Redis
centos环境下nginx高可用集群的搭建指南
2022/07/23 Servers