封装剪贴板:

    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. activiti7完成当前任务

    package com.zcc.acvitivi; import org.activiti.engine.ProcessEngine;import org.activiti.engine.Proces ...

  2. 开发效率优化之Git分布式版本控制系统(一)

    阿里P7移动互联网架构师进阶视频(每日更新中)免费学习请点击:https://space.bilibili.com/474380680本篇文章将先从Git分布式版本控制系统来阐述开发效率优化 一,企业 ...

  3. Python可以用于客户端Web开发吗?

    N00b在Python,但我有大量的PHP经验,并希望扩展我的技能. 我知道Python在服务器端执行方面很出色,只是想知道客户端. 解决方案 你看过skulpt吗? http://www.skulp ...

  4. 用html写博客好麻烦

    <!DOCTYPE html> .margin-test { margin-top:5px; margin-right:10px; margin-bottom:15px; margin-l ...

  5. ArcGis 创建Annotation注记要素类、添加注记要素 并加载到Activeview AO C#

    AO中一般有两种方式存储图面注记元素,一种使用TextElement,它是文档级的元素,编辑后要通过文档(mxd)保存:另一种是使用Annotation要素类,它是一个独立的要素类(featurecl ...

  6. Groovy学习:第四章 Groovy特性深入

    作者:chszs 1. 断言 Java开发者常常使用JUnit或TestNG做单元测试,所以对断言是很清楚的.断言是用于验证假设的条件是否为真.在Groovy的断言中,如果假设的条件不为真,那么就会抛 ...

  7. 1、eureka注册中心单机

    Spring Cloud 2.x系列之 eureka注册中心单机 一.简介 Spring Cloud Eureka是Spring Cloud Netflix项目下的服务治理模块.而Spring Clo ...

  8. Javascript高级程序设计--读书笔记之理解原型对象

    先上一段代码和关系图 function Person(){} Person.prototype.name = "Nic" Person.prototype.age = 22 Per ...

  9. ios执行失去焦点,不执行点击事件

    原因:由于JavaScript为单线程,同一时间只能执行处理一个事件.“blur优先于click执行”.而在本示例中,由于blur处理程序,会将对下拉框展示区隐藏,所以导致其后续click事件并不会执 ...

  10. 【Luogu】【关卡2-5】字符串处理(2017年10月)

    任务说明:这里的字符串处理还会变得更加的有意思,难度也更大.需要好好地思考一下.