<!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. Oracle ASH报告生成和性能分析

    我写的SQL调优专栏:https://blog.csdn.net/u014427391/article/category/8679315 对于局部的,比如某个页面列表sql,我们可以使用Oracle的 ...

  2. webrtc aecd算法解析一(原理分析)

    webrtc的回声抵消(aec.aecm)算法主要包括以下几个重要模块: 回声时延估计 NLMS(归一化最小均方自适应算法) NLP(非线性滤波) CNG(舒适噪声产生) 回声时延估计 这张图很多东西 ...

  3. spring设计模式_代理模式

    代理模式应该是Spring核心设计模式之一了 先说下代理模式特性: 1.有代理人和被代理人 2.对于被代理的人来说,这件事情是一定要做的,但是我又不想做,所有就找代理人来做. 3.需要获取到被代理人的 ...

  4. android学习笔记--检测是否为wifi环境

    ConnectivityManager cm = (ConnectivityManager) getSystemService(Context.CONNECTIVITY_SERVICE); // 获取 ...

  5. 构建现代Web应用时究竟是选择传统web应用还是SPA

    在大前端盛行的今天,似乎前后端分离的开发模式才是大势所趋,而SPA的概念更是应运而生.现在随便构建一个web应用程序如果你不是使用SPA的话,就会感觉有点low,但是真的是这样吗?今天这篇文章我们就来 ...

  6. Java集合详解1:ArrayList,Vector与Stack

    今天我们来探索一下LinkedList和Queue,以及Stack的源码. 具体代码在我的GitHub中可以找到 https://github.com/h2pl/MyTech 喜欢的话麻烦star一下 ...

  7. spring里的三大拦截器

    Filter 新建 TimeFilter @Component public class TimeFilter implements Filter { @Override public void in ...

  8. 104 - kube-scheduler源码分析 - predicate整体流程

    (注:从微信公众:CloudGeek复制过来,格式略微错乱,更好阅读体验请移步公众号,二维码在文末) 今天我们来跟一下predicates的整个过程:predicate这个词应该是“断言.断定”的意思 ...

  9. 详解mybatis配置文件

    在前面两篇文章中,大致与大家分享了基于Java的ORM框架,Mybatis基本架构和Mybatis实现CRUD的基本原理与流程,在本篇文章中,继续与大家分享Mybatis配置文件. 通过研究Mybat ...

  10. 解决Win10系统下 C# DateTime 出现星期几的问题

    昨天晚上写代码的时候偶然发现 DateTime 里出现了星期几,当时一阵凌乱,去网上百度没有详细解决办法,很多人说可以用用 ToString 解决. 也有部分人说可以修改系统时间的显示,我打算试一下看 ...