摘要:复制内容到剪贴板插件官网地址引用方式默认是截取中的的属性值截取输入框中的值里面还有很多高级用法可以前往官网逻辑更多细节官网框架提供的剪切板插件
最近使用Vue开发Line(日韩的一款类似中国微信平台)的内嵌H5.里面的有一个需求就是将当前链接粘贴,然后发送到pc端,在电脑上进行打开。所有搜集找到了一下几种情况:1.不带input输入框的原生js方法
这种情况适用于复制非输入框中的文本到剪切板
2.带输入框的原生js方法被复制的内容
用于复制input,textarea中的文本
3.js复制内容到剪贴板插件(clipboard.js)这种方法也可以进行延深,充当和方法1一样的用途。动态创建一个input输入框,将其内容置为想复制的内容,最后在将其移除或者隐藏即可。
clipboard.js官网clipboard.js CDN地址
引用方式:NPM npm install --save clipboard
CDN
4. Vue框架提供的剪切板插件 vue-clipboard2里面还有很多高级用法,可以前往官网逻辑更多细节 Clipboard官网
import Vue from "vue" import VueClipboard from "vue-clipboard2" VueClipboard.config.autoSetContainer = true // add this line Vue.use(VueClipboard)
Sample1
Sample2
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/95750.html
摘要:平时的开发中我们难免要上传一些网页截图图片等,传统的选择文件上传使用起来不方便,这里介绍一种使用和实现的剪切板黏贴上传图片功能。剪切板中图片的获取与上传通过,我们可以以的形式获取到剪切板中的图片,然后将数据作为参数通过的方式传输到服务器端。 平时的开发中我们难免要上传一些网页截图、图片等,传统的选择文件上传使用起来不方便,这里介绍一种使用js和node实现的剪切板黏贴上传图片功能。当我...
摘要:前言最终适配所有机型的方案基于官网这个库由几个不同的提供商托管。提供的复制失败的方法,进行复制失败提示复制失败请手动选择复制。上其他相关分享使用实现前端页面复制到粘贴板的功能中配合实现点击按钮复制内容到剪切板 前言 最终适配所有机型的方案基于clipboardjs官网https://clipboardjs.com/ 这个库由几个不同的CDN提供商托管。选择你最喜欢的:) 建议使用 v...
摘要:在用户执行粘贴操作的时候,能够获得剪切板的内容,本文讨论一下这个问题。目前只有支持获取剪切板中的图片数据。这么多的判断条件,基本可以确定通过剪切板过来的是粘贴的文件。 在用户执行粘贴操作的时候,js能够获得剪切板的内容,本文讨论一下这个问题。 目前只有Chrome支持获取剪切板中的图片数据。还好需要这个功能的产品目前只支持Chrome和Safari,一些Chrome的新特性是可以尽情使...
阅读 2104·2023-04-25 14:56
阅读 2379·2021-11-16 11:44
阅读 2653·2021-09-22 15:00
阅读 1878·2019-08-29 16:55
阅读 2118·2019-08-29 14:04
阅读 2287·2019-08-29 11:23
阅读 3644·2019-08-26 10:46
阅读 1886·2019-08-22 18:43