<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<%-- <script src="<%=Config.GetJSAndCss("jquery-1.6.1.min.js") %>" type="text/javascript"></script>--%>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
</head>
<body>
<!-- Target -->
<input id="foo" value="http://testwww.doresuwe.com/four-years/treasure-hunt-game/" readonly="readonly" style="background:#CCCCCC"/> <!-- Trigger -->
<button class="btn" data-clipboard-target="#foo">
<img src="https://clipboardjs.com/assets/images/clippy.svg" alt="Copy to clipboard" width="50" height="50" />
</button>
</body>
</html>
<script>
$(function () {
var clipboard = new ClipboardJS('.btn');
clipboard.on('success', function (e) {
alert("copy成功!Copy的内容是:" + e.text);
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
e.clearSelection();
});
clipboard.on('error', function (e) {
alert("当前环境不支持复制到粘贴板,请手动复制,蟹蟹٩('ω')و");
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
});
})
</script>

clipboardjs复制到粘贴板的更多相关文章

  1. 转JS--通过按钮直接把input或者textarea里的值复制到粘贴板里

    document.activeElement属性为HTML 5中新增的document对象的一个属性,该属性用于返回光标所在元素.当光标未落在页面中任何元素内时,属性值返回body元素. setSel ...

  2. zeroclipboard实现多浏览器复制到粘贴板功能

    zeroclipboard实现多浏览器复制到粘贴板功能(单个复制按钮和多个复制按钮) 为了更好的用户体验,现在很多网站中文本框的内容只需要点击复制按钮这样就能把内容复制到粘贴板了:出于兼容性的考虑,基 ...

  3. js 实现复制到粘贴板功能

    前言:js 或者 jquery 都可以实现的复制到粘贴板功能,有时还想要有换行等格式(同 textarea) 网站地址:我的个人vue+element ui demo网站 github地址:yuleG ...

  4. Vue 实现复制到粘贴板功能

    vue 实现复制到粘贴板功能需要依赖到 clipboard.js 1. 首先需要安装依赖  * 出现错误的话,可以试试 cnpm npm install --save vue-clipboard2 2 ...

  5. javascript网页复制功能-复制到粘贴板-兼容多数浏览器(不使用flash)

    使用方法:clipBordCopy("hello Copy");//执行后复制hello Copy到粘贴板 通过 var result = clipBordCopy("h ...

  6. 使用clipboard插件实现div、textarea、input里面的内容复制到粘贴板

    一.引用clipboard的js文件 二.编写代码.data-clipboard-action=“copy”,代表要执行的动作是复制.data-clipboard-target里面要是要选择复制的元素 ...

  7. C++ 复制到粘贴板

    网上好多教程讲如何复制到剪切板,但是有可能复制的是乱码,为了方便,将CString类型的复制到剪切板 CString source;if (OpenClipboard()){//防止非ASCII语言复 ...

  8. 【C#学习笔记】文本复制到粘贴板

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  9. js复制到粘贴板

    http://www.cnblogs.com/52fhy/p/5383813.html(移动端有兼容性问题) 要页面加载完直接绑定事件,否则第一次点击是绑定事件,第二次才触发事件 移动端需要设置tex ...

随机推荐

  1. vue 传值 概述 个人理解

    1 父传子   子组件  props:[‘自定义属性名’]   父组件  v-bind:自定义属性名="值"  理解 子组件创建一个自定属性   父组件使用vue指令绑定到 自定义 ...

  2. SpringBoot进阶教程(二十二)集成RabbitMQ---MQ实战演练

    RabbitMQ是一个在AMQP基础上完成的,可复用的企业消息系统.他遵循Mozilla Public License开源协议.RabbitMQ是流行的开源消息队列系统,用erlang语言开发.Rab ...

  3. MySQL视图简介与操作

    1.准备工作 在MySQL数据库中创建两张表balance(余额表)和customer(客户表)并插入数据. create table customer( id int(10) primary key ...

  4. Chrome浏览器下自动填充的输入框背景

    记录下从张鑫旭老师的微博中看到关于input输入框的属性 1.autocomplete="off" autocomplete 属性规定输入字段是否应该启用自动完成功能 自动完成允许 ...

  5. Asp.Net Core 轻松学-玩转配置文件

    前言     在 .NET Core 项目中,配置文件有着举足轻重的地位:与.NetFramework 不同的是,.NET Core 的配置文件都以 .json 结尾,这表示一个标准的 json 格式 ...

  6. 谈谈我理解的SA——Systems Architecture

    什么是SA? SA即Systems Architecture,是系统体系结构. 系统体系结构是定义系统的结构.行为和系统视图的概念模型.架构师将其系统的形式化描述或表示出来,以支持结构和行为的推理的方 ...

  7. SQL Server 一列或多列重复数据的查询,删除(转载)

    转载来源:https://www.cnblogs.com/sunxi/p/4572332.html 业务需求 最近给公司做一个小工具,把某个数据库(数据源)的数据导进另一个数据(目标数据库).要求导入 ...

  8. glibc溢出提权CVE-2018-1000001总结

    遇到了好几个centos6.5,一直尝试想提权.暂未成功,靶机内核:2.6.32-696.18.7.el6.x86_64. glibc版本:ldd (GNU libc) 2.12 目前编译过程中都发现 ...

  9. SpringBoot JPA(实现查询多值)

    JPA是java Persistence API简称,中文名:java持久层API,JPA是JCP组织发布的J2EE标准之一 1.创建DataSource连接池对象 <dependency> ...

  10. Snapde和常用的CSV文件编辑器对比

    Snapde,一个专门为编辑超大型数据量CSV文件而设计的单机版电子表格软件:它运行的速度非常快,反应非常灵敏. CSV是一种用逗号分隔列.回车分割行的文本文件,市面上常用的CSV编辑软件有:Snap ...