pasteimg浏览器中粘贴图片jQuery插件

pasteimg是一款可以在浏览器中实现图片粘贴的jQuery插件,兼容Chrome、Firefox、IE11以及其他使用这些内核的浏览器,比如,国内著名的360浏览器。

pasteimg可以识别浏览器中直接复制的图片,也可以识别复制的富文本中的图片。仅仅可以识别在浏览器中复制的内容,操作系统中复制的图片是不能识别的。

pasteimg依赖jQuery,简单易用,引入jQuery和paste.image.js后,调用方式如下:

1 //在需要监听粘贴事件的dom元素上调用pasteImage方法
2 //调用pasteImage方法需要传入一个callback参数
3 //一旦粘贴的内容中发现图片,就会调用callback
4 //调用callback时,会传入一个数组,包含了所有的图片
5 //本插件会尽可能的将图片转换成base64编码,但受到跨域的限制,如果不能转换,将返回图片的绝对url路径
6 $("#container").pasteImage(function(imgs){
7   //imgs is array that contain all image, you can do something...
8 });

View on GitHub

有疑问欢迎反馈!

时间: 2024-10-10 00:03:45

pasteimg浏览器中粘贴图片jQuery插件的相关文章

div中粘贴图片并上传服务器 div中拖拽图片文件并上传服务器

应用简介:此文主要是描述如何在前端div中直接ctrl+v 粘贴图片,并上传到服务器,包括拖拽图片文件到div中 应用场景描述:用QQ或者其它切图软件截图,在指定的div中ctrl+v 粘贴并显示,点击上传按钮,图片上传到服务器.类似实现了此功能的网站有 知乎,强力建议博客园实现此功能,                     写博客时插入图片方便的多. 适用环境:本代码目前适用谷歌浏览器,其它浏览器需要稍微改良一下即可,问题不大. 开发环境:vs2015 mvc 不说废话了,开始吧: 1:首先

Ckeditor 中粘贴图片

我们在ckeditor 中有上传图片,但是实际使用中这种手动上传图片方式并不是很方便,而是复制或者截图粘贴图片. 这里我们实现主要是获取对应的粘贴事件. CKEDITOR.instances["editor1"].on('instanceReady', function(e) { this.document.on("paste", function(e) { var items = e.data.$.clipboardData.items; for(var i =

能跨域和跨浏览器的flashcookie for jquery插件

对于写网站时需要跨域和跨浏览器的可以看看这个. 引入jquery  和 swfstore.min.js 就可以了,蛮简单好用的,会jquery基础就可以咯. mySwfStore.set('myKey', '值'); //设置flashcookie mySwfStore.get('myKey'); //读取flashcookie 还有清除等命令在例子里,大家可以自己看哦. 跨域只需要把 js代码里的 swf_url 地址设置成绝对地址就可以了. 比如 swf_url=http://www.a.c

一个在h5的canvas元素中画扑克牌jquery插件实现

1 //非架构 2 ; (function ($) { 3 var aspect = 5.7 / 8.8;//扑克宽和高比例 4 function PaintBoder(canv, x, y, h,poker) { 5 var boder = new Boder(canv, h); 6 boder.X = x; 7 boder.Y = y; 8 var c = canv.getContext("2d"); 9 c.save() 10 c.lineWidth = 1; 11 boder.

js下载浏览器中的图片

jquery function download(src) { var $a = $("<a></a>").attr("href", src).attr("download", "img.png"); $a[0].click(); } 原生javascript function download(src) { var $a = document.createElement('a'); $a.setAtt

十个jQuery图片画廊插件推荐

jQuery的画廊插件可以将分组图像和多媒体资料转成类似Flash的图像或照片.当幻灯片已经成为网站的重要组成部分,jQuery的重要性不能被忽视.下面为你介绍了10个最有美感,创新性和创造性的jQuery图片画廊插件: 1.How to Create a Simple Slideshow using Mootools / JQuery 当我们想要在有限的屏幕空间展示很多内容,这要使用到幻灯片.幻灯片是最佳的可以展现大量的信息的方式.在这篇文章中我将展示使用MooTools / Jquery做出

可控制GIF动画图片播放和暂停jQuery插件

gifplayer是一款可以控制GIF动画格式图片播放和暂停的jQuery插件.该jQuery插件使用简单,文件体积小.可用于控制任何GIF动画图片的开始播放和暂停播放. 要使用该GIF动画图片jquery插件,可以分为下面的五个步骤: 在你的页面中添加一个静态版本的GIF图片,格式为PNG.jpg等图片格式都可以. 在img标签中添加data-gif属性指向GIF动画图片,或者不写也可以. 在图片文件夹中放置.gif格式的图片和它的静态版本的图片,两个图片的名称要相同. 在你的页面中引入gif

利用navigator对象在浏览器中检查插件

利用navigator对象在浏览器中检查插件,实现的代码如下. 1 // IE4+.firefox.chrome.safari.opera中,利用navigator检测插件 ,name为插件的名字 2 function hasPlugin(name) { 3 name = name.toLowerCase(); 4 for(var i = 0; i < navigator.plugins.length; i++) { 5 if (navigator.plugins[i].name.toLower

50个jQuery插件可将你的网站带到另一个高度

Web领域一直在发生变化并且其边界在过去的每一天都在发生变化(甚至不能以小时为计),随着其边界的扩展取得了许多新发展.在这些进步之中,开发者的不断工作创造了更大和更好的脚本,这些脚本以插件方式带来更好的终端用户体验,它们比原来更轻量级,还有更强的处理能力. 关键是这些新发展起来的脚本和插件是能构建响应式Web的,而且还不会丧失它们原有的功能特性——除了更优秀和更轻巧(就文件大小而言)之外,它们还不会增加页面加载的时间. 通过浏览文档,掌握JQuery的语法是很容易的.它可以支持选择DOM元素,创