JavaScript 十行原生代码实现复制内容到剪贴板
十行原生代码,不引入任何 JS 库,目前大部分浏览器与移动平台都可兼容。
function copyToClipboard(value, callback) {
var textarea = document.createElement("textarea");
textarea.value = value;
document.body.appendChild(textarea);
textarea.select();
document.execCommand("Copy");
textarea.parentNode.removeChild(textarea);
if (typeof callback === "function") {
callback(value);
}
}
- 参数 1 => 需要复制的值
- 参数 2 => 回调函数
- 回调函数 参数 1 => 被复制的值
Demo 地址、Demo 源码,如果有兼容问题欢迎评论告诉我!
2019年3月24日补充:
iOS 移动端不兼容!!!(好吧,很尴尬。)
JavaScript 十行原生代码实现复制内容到剪贴板的更多相关文章
- JavaScript复制内容到剪贴板
移动端 需要复制内容到剪贴板时, clipborad.js 不支持ios微信版浏览器,可配合使用 execCommand 使其兼容, 完成一键复制淘口令的功能. 注意使用clipborad.js时,i ...
- 《JS实现复制内容到剪贴板功能,可兼容所有PC浏览器,不兼容手机端》
前记:本来原生的JS是有提供一个函数来实现这个功能(window.clipboardData),但是很遗憾,这个函数仅仅支持IE和FF浏览器,所以基本用处不大.下边介绍的是一个第三方插件库(ZeroC ...
- JS复制内容到剪贴板(兼容FF/Chrome/Safari所有浏览器)
现在浏览器种类也越来越多,诸如 IE.Firefox.Chrome.Safari等等,因此现在要实现一个js复制内容到剪贴板的小功能就不是一件那么容易的事了. 在FLASH 9 时代,有一个通杀所有浏 ...
- Zclip点击复制内容到剪贴板兼容各浏览器
WEB开发中,要让用户复制页面中的一段代码.URL地址等信息,为了避免用户拖动鼠标再进行右键复制操作而可能出现的差错,我们可以直接在页面中放置一个复制按钮,只需要轻轻一点这个复制按钮,内容将会被复制, ...
- JS复制内容到剪贴板: 兼容IE、Firefox、Chrome、Safari所有浏览器【转】
正 文: 现在浏览器种类也越来越多,诸如 IE.Firefox.Chrome.Safari等等,因此现在要实现一个js复制内容到剪贴板的小功能就不是一件那么容易的事了. 在FLASH 9 时代,有一个 ...
- 使用clipboard.js实现复制内容至剪贴板
下载插件 clipboard.js是不依赖flash,实现复制内容至剪贴板的js插件.下载clipboard.js的压缩包,根据需要选择dist目录下的压缩或未压缩版. github地址:https: ...
- Javascript复制内容到剪贴板,解决navigator.clipboard Cannot read property 'writeText' of undefined
起因 最近帮同事实现了一个小功能--复制文本到剪贴板,主要参考了前端大神阮一峰的博客,根据 navigator.clipboard 返回的 Clipboard 对象的方法 writeText() 写文 ...
- unity探索者之复制内容到剪贴板
版权声明:本文为原创文章,转载请声明http://www.cnblogs.com/unityExplorer/p/8417014.html unity中提供的TextEditor类,只能在window ...
- JavaScript 复制内容到剪贴板
<html> <head> <title>Selector</title> <script language="javascript&q ...
随机推荐
- Neutron命令测试3
1.打开Ubuntu的/etc/network/interfaces文件 .默认内容如下 auto lo iface lo inet loopback 2.如果以DHCP方式配置网卡,则改为:auto ...
- (转)linux route命令深入浅出与实战案例精讲
linux route命令深入浅出与实战案例精讲 http://blog.51cto.com/oldboy/1119453 深入浅出之-route命令实战使用指南 http://blog.51cto. ...
- Spring Cloud学习笔记之微服务架构
目录 什么是微服务 架构优点 架构的挑战 设计原则 什么是微服务 微服务构架方法是以开发一种小型服务的方式,来开发一个独立的应用系统的. 其中每个小型服务都运行在自己的进程中,并经常采 ...
- stm32 外部中断学习
今天我们看看STM32的外部中断实验. STM32 供 IO 口使用的中断线只有 16 个,但是 STM32 的 IO 口却远远不止 16 个,那么 STM32 是怎么把 16 个中断线和 IO 口一 ...
- phpmyadmin 开放远程登录的权限
*linux下的修改* 在phpmyadmin.conf 加上如下试一下 <Directory "phpmyadmin路径"> AllowOverride No ...
- pat1044. Shopping in Mars (25)
1044. Shopping in Mars (25) 时间限制 100 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Shop ...
- Redis-Service.Stack的初级使用
主要解决Redis服务器带有密码的情况下初始化. 创建RedisHelper类,直接贴代码: using ServiceStack.Redis;using System;class RedisHelp ...
- js获取url的参数和值的N种有效方法
js获取url的参数和值的N种有效方法 function getParameterByName(name) { name = name.replace(/[\[]/, "\\\[" ...
- 【Android学习入门】Android中activity的启动模式
启动模式简单地说就是Activity启动时的策略,在Androidmanifest.xml文件中的标签android:launchMode属性设置,在Android中Activity共有四种启动模式分 ...
- 怎样解决putty终端乱码的方法
原文地址:https://jingyan.baidu.com/article/3aed632e5f00ae701080913a.html?qq-pf-to=pcqq.c2c 终端输入:echo $LA ...