/*  HTML:
* <a href="javascript:;" class="copy" data-clipboard-text="copy"></a>
*/
$('.bdsharebuttonbox .copy').on('click', function (){
$(this).attr('data-clipboard-text',window.location.href); var clipboard = new Clipboard('.copy');
clipboard.on('success',function(e){
e.clearSelection();
alert('复制成功');
});
clipboard.on('error',function(e){
e.clearSelection();
alert('复制失败');
});
}); // vue 文本复制插件
/* install:
* 1、npm install --save vue-clipboard2
* 2、import Vue from 'vue'
* 3、import VueClipboard from 'vue-clipboard2'
*/
/* HTML:
* <el-button class="ml10" type="text" size="medium"
* v-clipboard:copy="sysAppIds"
* v-clipboard:success="onCopy"
* v-clipboard:error="onError">点击复制</el-button>
*/
export default {
data(){
return {
sysAppIds: 'xxxxxxxxxxxsx'
}
},
methods: {
// 复制成功
onCopy(e){
console.log(e.text);
},
// 复制失败
onError(e){
alert("失败");
},
}
}

js文本复制插件&vue的更多相关文章

  1. JS 一键复制插件应用 和 原生实现

    一.目前来说复制功能 clipboard.js基本可以兼容所有浏览器,可以任意复制文本,官方地址 https://clipboardjs.com/ 1.进入官方网站下载 然后引入 <script ...

  2. echarts.js(图表插件)2.0版会导致 ZeroClipboard.js(复制插件)失效,3.0版未知。

    解决方法:ZeroClipboard.js先于echarts.js加载.

  3. vue.js国际化vue-i18n插件的使用问题,在模版文本、组件方法、jsf方法里的使用

    vue.js国际化vue-i18n插件的使用问题,在模版文本.组件方法.jsf方法里的使用 1.在文本里使用{{$t("xxx")}} <span>{{$t(" ...

  4. JS实现文本复制与剪切

    我们在网页上放置一个复制按钮,主要用来方便用户复制链接之类的复杂文本,以往的做法是,通过JS依靠Flash,甚至借助jQuery庞大的js库来实现文本复制到剪贴板的.今天我要给大家介绍的是一款极现代的 ...

  5. 原生js日期时间插件鼠标点击文本框弹出日期时间表格选择日期时间

    原文出处 (这是我从互联网上搜来的,感觉能满足各方面的需求.个人感觉挺不错的,所以后期修改了一下向大家推荐!) 效果图: html代码: <!DOCTYPE html PUBLIC " ...

  6. chrome浏览器的VUE调试插件Vue.js devtools

      chrome浏览器的VUE调试插件Vue.js devtools 应用商店直接安装 安装成功后在VUE文件打开可以直接调试: 提示效果如下: F12进入调试状态即可: 安装中出现的问题: 插件安装 ...

  7. clipboard.js -- js实现将文本复制到剪贴板的方法

    资源 推荐使用:clipboard.js 官方教程地址:https://clipboardjs.com/#example-text 官方github地址:https://github.com/zeno ...

  8. 【转】js实现复制到剪贴板功能,兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  9. 纯js实现复制到剪贴板功能

    在网页上复制文本到剪切板,一般是使用JS+Flash结合的方法,网上有很多相关文章介绍.随着 HTML5 技术的发展,Flash 已经在很多场合不适用了,甚至被屏蔽.本文介绍的一款JS插件,实现了纯J ...

随机推荐

  1. 异数OS TCP协议栈测试(五)--关于QOS与延迟

    . 异数OS TCP协议栈测试(五)–关于QOS与延迟 ##本文来自异数OS社区 github: https://github.com/yds086/HereticOS 异数OS社区QQ群: 6524 ...

  2. SSM前后端分离/不分离对比Demo

    之前某些原因,整理了一个小的Demo,用于演示.个人认为在SSM前后端不分离的基础上在前端处理上比较麻烦一点之后就是注解的使用.总结一些对比,仅是自己掌握的,不够严谨,不足之处请大佬批评指正. 路由控 ...

  3. 通过示例学习rholang(下部:课程8-13)

    课程8——状态通道和方法 保存数据 到现在为止,你已经很擅长于发送数据到元组空间和从元组空间中获取数据.但是无论你在什么时候进行计算,你有时需要把一些数据放在一边晚点才使用.几乎所有编程语言都有变量的 ...

  4. [CERC2016]凸轮廓线

    题意 https://www.luogu.org/problem/P3680 思考 拆点即可. 注意精度. 代码 // luogu-judger-enable-o2 #include<bits/ ...

  5. MySQL基础知识清单

    学习大纲(★为重点,√其次) 一.为什么要学习数据库 二.数据库的相关概念 DBMS.DB.SQL 三.数据库存储数据的特点 四.初始MySQL MySQL产品的介绍 MySQL产品的安装 ★ MyS ...

  6. CSS-08-边框属性设置

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. 深入理解Java 中SPI 制

    深入理解Java 中SPI 制 概述 SPI(Service Provider Interface),是JDK内置的一种服务提供发现机制,可以用来启用框架扩展和替换组件,主要是被框架的开发人员使用,比 ...

  8. 如何用Git.io来生成自定义后缀名的短网址

    如何用Git.io来生成自定义后缀名的短网址 git.io是Github的官方短网址,它是用来缩短Github上项目的网址. 效果:Git.io/wacsh将会跳转到https://xhemj.git ...

  9. 深入SpringMVC注解

    原文链接:https://blog.csdn.net/chenpeng19910926/article/details/70837756 @Controller 在SpringMVC 中提供了一个非常 ...

  10. Distance Dependent Infinite Latent Feature Model 阅读笔记1

    阅读文献:Distance Dependent Infinite Latent Feature Model 作者:Samuel J.Gershman ,Peter I.Frazier ,and Dav ...