位置: 编程技术 - 正文
推荐整理分享分享js粘帖屏幕截图到web页面插件screenshot-paste(分享js粘帖屏幕怎么弄),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:分享js粘帖屏幕怎么用,js 粘贴图片,js触发粘贴事件,js复制粘贴功能,分享js粘帖屏幕不显示,分享js粘帖屏幕不显示,分享js粘帖屏幕怎么用,分享js粘帖屏幕不显示,内容如对您有帮助,希望把文章链接给更多的朋友!
在很多场合下,我们可能有这样的需求:提供个屏幕截图上传到系统,作为一个凭证。传统的操作方式是:屏幕截图,保存文件到本地,在web页面上选择本地文件并上传,这里至少需要三步。有没有可能直接将截图粘帖到web页面上,然后上传?答案是:可以的。这就是本文要介绍的内容了。
由于我的项目有上传屏幕截图这样的需求,为了用户体验更佳,减少操作步骤,我在网上搜了一遍之后,找到了一些眉目。为了便于复用和共享,我又对该功能做了一些封装,于是便有了这个插件 screenshot-paste。运行效果如下图:
插件调用示例:
插件依赖:
从调用示例中,我们可以看到,这个插件依赖如下:
1)需要引用jquery
2)插件本身screenshot-paste.js
3)需要一个textbox和图片预览div
插件可配置项:
插件方法:
该插件目前只有一个方法 getImgData,调用示例如下:
var imgData = $('#demo').screenshotPaste('getImgData');值得一提的是,该方法返回的是img的src属性里面的内容,即base编码的图片数据内容。
这样的数据上传到服务器之后,需要用base解码,解码示例代码如下(C#版):
插件源码:
标签: 分享js粘帖屏幕怎么弄
本文链接地址:https://www.jiuchutong.com/biancheng/377439.html 转载请保留说明!上一篇:基于javascript实现页面加载loading效果(javascript运用)
下一篇:深入解析JavaScript中函数的Currying柯里化(深入解析抑郁症:什么是它的表现?别小看它的危害程度!)
友情链接: 武汉网站建设