封装剪贴板:

    function Copy(str) {
var save = function (e) {
//设置需要复制模板的内容
e.clipboardData.setData('text/plain',str);
//阻止默认行为
e.preventDefault();
}
// h5监听copy事件,调用save函数保存到模板中
document.addEventListener('copy',save);
// 调用右键复制功能
document.execCommand('copy');
//移除copy事件
document.removeEventListener('copy',save);
alert("复制成功");
}

点击调用函数

 $('.CopeBorder').on('click',function () {
var CopeBorder=$(".CopeText").text();
// console.log(typeof CopeBorder)
Copy(CopeBorder);
})

js 实用封装 点击按钮复制到剪贴板的更多相关文章

  1. js 实现页面点击按钮复制内容

    前言: 我们平时在页面中是按照长按来实现复制相关的内容,那么怎么用js实现点击按钮实现复制相关的内容呢?请看如下方法: 实现步骤: 1.引入相关的js(ClipboardJS插件) <scrip ...

  2. jquery点击按钮复制内容

    做移动端的项目遇到一个需求要点击按钮复制dom里的内容,看了很多资料显示必须textarea或者input里的内容才能简单复制,还有就是用插件的了,最终都因为遇到各种问题放弃,最终选择了最简单的点击复 ...

  3. 原生 js 实现点击按钮复制文本

    最近遇到一个需求,需要点击按钮,复制 <p> 标签中的文本到剪切板 之前做过复制输入框的内容,原以为差不多,结果发现根本行不通 尝试了各种办法,最后使了个障眼法,实现了下面的效果 一.原理 ...

  4. 使用JS代码实现点击按钮下载文件

    有时候我们在网页上需要增加一个下载按钮,让用户能够点击后下载页面上的资料,那么怎样才能实现功能呢?这里有两种方法: 现在需要在页面上添加一个下载按钮,点击按钮下载文件. 题外话,这个下载图标是引用的 ...

  5. CSS3和js炫酷点击按钮3D翻转动画特效

    简要教程 flipside是一款使用CSS3和js制作的炫酷点击按钮无缝过渡到确认面板的过渡动画特效.该点击按钮特效在按钮不同方向的边部点击时,产生的过渡动画特效是不一样的. 在线预览   源码下载 ...

  6. iOS中点击按钮复制指定内容

    话不多说,直接上图和代码:

  7. js实现点击按钮复制文本功能

    最近项目活动中用到复制文本功能,发现在chrome中之前的clipboard的demo失效了,查了下发现是因为版本升级导致的.最新用法如下: <!DOCTYPE html> <htm ...

  8. JS实现PC、Android、IOS端的点击按钮复制内容功能

    直接上代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  9. JS复制文本到粘贴板,前端H5移动端点击按钮复制文本

    <span id="codeNum">FTYHDSDW</span> <span class=" code-btn" id=&qu ...

随机推荐

  1. 数据库(二)—— MySQL索引优化

    目录 MySQL的索引优化 一.MySQL 5.7的初始化配置 二.MySQL配置文件 1.配置 2.配置文件作用 三.多实例 1.创建相关的目录 2.创建实例的配置文件 3.初始化 4.授权 5.启 ...

  2. helm-mode打开文件支持中文搜索

    helm-mode打开文件支持中文搜索 */--> code {color: #FF0000} pre.src {background-color: #002b36; color: #83949 ...

  3. ansible了解

    基础知识: ansible简介 ansible 是个什么东西呢?基于 Python paramiko 开发,分布式,无需客户端,轻量级,配置语法使用 YMAL 及 Jinja2模板语言,更强的远程命令 ...

  4. application/json和application/x-www-form-urlencoded参数接收

    application/json ajax请求中content-type:application/json代表参数以json字符串传递给后台,controller接收需要@RequestBody 接收 ...

  5. 2018-2-13-win10-uwp-hashcash

    title author date CreateTime categories win10 uwp hashcash lindexi 2018-2-13 17:23:3 +0800 2018-2-13 ...

  6. 关于PCB的Mark点

    关于PCB的Mark PCB板子做好后,需要贴装元器件,现在元器件的贴装都是通过机器来完成的(SMT).SMT中会用到mark点. 一.什么是Mark点 Mark点也叫基准点或者光学定位点,为贴装工艺 ...

  7. linux调用本地镜像

    首先先让系统显示出来 iso 已经挂载 然后#mkdir  /mnt/cdrom #mount  /dev/cdrom /mnt/cdrom #df  -H  查看是否已经挂载上 #cd  /etc/ ...

  8. 【CSS3】rgba与opacity

    RGBA 语法 R:红色值.正整数 | 百分数 G:绿色值.正整数 | 百分数 B:蓝色值.正整数| 百分数 A:透明度.取值0~1之间 为什么要用RGBA而不用opacity 因为在项目中需要用到一 ...

  9. javascript与jquery删除元素节点

    今天工作的时候遇到一个删除的问题,研究了下发现是没有很好的区分js和jquery的删除方法,在此澄清一下 工作的代码如下 // 删除图片 $("#js_takePhotoWrap" ...

  10. 前端学习(十三)js运算符(笔记)

    类型转换:    1.强制类型转换:(数字字符串转数字) parseInt()        parseFloat()        Number()--严格转换 NaN:            不是 ...