Js实现一键复制小功能
function copyToClipboard(textToCopy) {
// navigator clipboard 需要https等安全上下文
if (navigator.clipboard && window.isSecureContext) {
// navigator clipboard 向剪贴板写文本
return navigator.clipboard.writeText(textToCopy).then(function () {
layer.msg("复制成功Https!", { icon: 1 })
});
} else {
// 创建text area
let textArea = document.createElement("textarea");
textArea.value = textToCopy;
// 使text area不在viewport,同时设置不可见
textArea.style.position = "absolute";
textArea.style.opacity = 0;
textArea.style.left = "-999999px";
textArea.style.top = "-999999px";
document.body.appendChild(textArea);
textArea.focus();
textArea.select();
return new Promise((res, rej) => {
// 执行复制命令并移除文本框
layer.msg("复制成功Http!", { icon: 1 });
document.execCommand('copy') ? res() : rej();
textArea.remove();
});
}
}
Js实现一键复制小功能的更多相关文章
- js实现一键复制
方法一: 使用插件 引入clipboard.js 使用如下 <script> copyFn = function() { var clipboard = new Clipboard('.c ...
- 微信小程序——长按复制、一键复制
wxml: 订单号:<text selectable='true' bindlongtap='copy' >{{OrderModel.OrderNo}}</text><b ...
- 通过如何通过js实现复制粘贴功能
在ie中window.clipboardData(剪切板对象)是可以被获取,所以利用这个方法我们可以实现在IE当中复制粘贴的功能,demo如下! <html> <head> & ...
- js小功能整理
/** * 判断是否包含字符串某字符串 * @param {[type]} str [被检测的字符串] * @param {[type]} substr [检测是否含有的字符串] * @return ...
- 移动端无法复制:使用clipboard.js碰到的一个小问题
移动端无法复制:使用clipboard.js碰到的一个小问题 直接看下面的代码:在移动端访问,点击,能正常复制. <html> <head> <meta http-e ...
- js实现点击按钮复制文本功能
最近项目活动中用到复制文本功能,发现在chrome中之前的clipboard的demo失效了,查了下发现是因为版本升级导致的.最新用法如下: <!DOCTYPE html> <htm ...
- JS类小功能
工作中,总是要处理一些前端的小功能.都是网上搜的JS脚本 <script> //防止页面后退 history.pushState(null, null, document.URL); wi ...
- js小功能记录
个人日常中遇到的js小功能记录,方便查看. /** * 判断是否包含字符串某字符串 * @param {[type]} str [被检测的字符串] * @param {[type]} substr [ ...
- 一款给力的一键复制js插件-clipboard.js
一款没有依赖的.给力的一键复制的JS插件 点我前往github 案例demo见下载包内demo文件夹. 这里晒出最常用的几种方式,以供不时之需. <!DOCTYPE html> < ...
随机推荐
- Veux mapState、mapGetters、mapActions、mapMutations && Vuex命名空间
1 # 一.四个map方法的使用 2 # 1.mapState方法:用于帮助我们映射state中的数据为计算属性 3 computed:{ 4 // sum(){ 5 // return this.$ ...
- 记一次 .NET 某工控自动化控制系统 卡死分析
一:背景 1. 讲故事 前段时间遇到了好几起关于窗体程序的 进程加载锁 引发的 程序卡死 和 线程暴涨 问题,这种 dump 分析难度较大,主要涉及到 Windows操作系统 和 C++ 的基础知识, ...
- Spring的Model 和 Map的原理
Model 和 Map 为什么在Model和Map中放值传入后会出现在request的上面. 9.1.源码解析 准备测试代码 @GetMapping("/goto") public ...
- Qt 国际化翻译
简介 Qt Linguist 提供了一套加速应用程序翻译和国际化的工具.Qt 使用单一的源码树和单一的应用程序二进制包就可同时支持多个语言和书写系统. 使用 QTranslator 来加载生成的 qm ...
- Redis 15 主从复制
参考源 https://www.bilibili.com/video/BV1S54y1R7SB?spm_id_from=333.999.0.0 版本 本文章基于 Redis 6.2.6 概述 主从复制 ...
- i40e网卡驱动遇到的一个问题
最近在排查一个crash文件的时候,遇到一个堆栈,即软中断收包的时候,skb的关联的dev是null,导致oops, 然后去crash分析的时候,发现skb的dev去不是null. 从oops到cra ...
- 超实用在线工具!能将文字加密为Emoji表情
试想一下,如果你需要将一段比较敏感的内容发送给你的好友. 但如果这段内容不小心外泄,被别人看到了,可能会带来很多麻烦. 那么,有什么方法能够让传输的文本内容不那么容易被"看破"呢? ...
- 学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(上)
学习ASP.NET Core Blazor编程系列一--综述 一.概述 Blazor 是一个生成交互式客户端 Web UI 的框架: 使用 C# 代替 JavaScript 来创建信息丰富的交互式 U ...
- 使用VS Code 搭建 platformio 平台
一.需要的资源网站 arduino GitHub:https://github.com/arduino espressif GitHub:https://github.com/espressif pl ...
- oracle数据泵导入导出数据
expdp 导出 1.管理员用户登入sqlplus sqlplus system/manger@pdb1 2.创建逻辑导出目录 create directory dpdata as '/home/or ...