位置: 编程技术 - 正文

clipboard.js无需Flash无需依赖任何JS库实现文本复制与剪切

编辑:rootadmin

推荐整理分享clipboard.js无需Flash无需依赖任何JS库实现文本复制与剪切,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

我们在网页上放置一个复制按钮,主要用来方便用户复制链接之类的复杂文本,以往的做法是,通过JS依靠Flash,甚至借助jQuery庞大的js库来实现文本复制到剪贴板的。今天我要给大家介绍的是一款极现代的,不需要flash,不依赖任何其他js库的非常小的插件,它叫clipboard.js。

运行效果图:

clipboard.js无需Flash无需依赖任何JS库实现文本复制与剪切

HTML首先加载本地clipboard.js文件。

然后就是在body中加上要复制或剪切的文本域内容以及按钮。

这里,我们使用了HTML5的data-属性,用来定位复制对象目标,它指向了文本域#foo,说明复制的是#foo中的value内容,aria-label属性定义了复制成功后的信息,用来提示复制结果信息。还有个属性data-clipboard-action,它定义当前操作是复制还是剪切,默认是复制,当data-clipboard-action="cut",这时,点击按钮将会剪切文本,跟WORD操作一样。当然,剪切操作仅适用于text和textarea。我们也可以不需要input和textarea等元素内容作为复制对象,我们可以将要复制的内容通过ata-clipboard-text属性定义在按钮上,点击按钮就可以复制到ata-clipboard-text对应的内容。

Javascript将以下一句代码加入到</body>前的<script>里,保存打开浏览,点击按钮即可复制。

当然我们可以再进一步处理,比如当复制完成后,提示复制成功信息更友好些,只要执行以下代码即可:

标签: clipboard.js无需Flash无需依赖任何JS库实现文本复制与剪切

本文链接地址:https://www.jiuchutong.com/biancheng/380303.html 转载请保留说明!

上一篇:JavaScript子窗口调用父窗口变量和函数的方法(js新开一个窗口)

下一篇:JS实现的车标图片提示效果代码(js标志)

  • 提足折旧是指
  • 代扣代缴个人所得税会计分录怎么做
  • 国税税务登记号查询
  • 环境保护税的应税污染物有哪些
  • 商业保理怎么账务处理
  • 定额的个体户需要汇算清缴吗
  • 小规模纳税人哪些发票可以抵税
  • 小规模升一般纳税人怎么操作
  • 机票行程单丢了可以重新打吗
  • 多余的实收资本可以转到其他应付款吗
  • 金税盘处于报税期不能开票是什么意思
  • 零售盘点窍门
  • 零售不要发票如何报税
  • 土地结转会计分录是什么
  • 确认主营业务成本的依据是什么单据
  • 哪些房屋交易需要公证
  • 自产产品销售增值税
  • 公司付款给个人一定要取得发票吗
  • 企业工会经费不足,可以向企业拨款吗
  • 增值税销项税抵扣不完能退给企业吗?
  • 企业筹办期间,发生亏损,应该计算为亏损年度
  • 销项在借方还是贷方
  • 电子税票号码是那个
  • 企业销售货物因违规处罚
  • 纳税主要是哪些方面
  • sd标准差是什么意思
  • 废品残料回收入库
  • 公司收到保险公司的理赔款怎么做分录
  • 外包物流适用范围
  • 上市公司企业股东转让股份交什么税费
  • 收到返还代扣代缴手续费如何入账?
  • 电费预提费用
  • 在win7系统中,添加打印机驱动程序
  • 赠品没有收到
  • 民办非企业的税金及附加放在哪个科目
  • 我整理的邪恶铭刻所有卡牌及自制卡
  • php改编码
  • 有限责任公司股东会的职权有哪些?
  • framework启动
  • 视同销售的行为
  • 第二季度企业所得税怎么计提
  • php读取excel文件
  • 刚刚学完小车可以学摩托车吗
  • php使用for循环实现乘法口诀表
  • 营改增后不得抵扣的进项税额
  • 营业收入为什么不包括营业外收入
  • 个人佣金收入怎样交税
  • 对公账户的种类有几种
  • java 类型推导
  • 开发支出在资产负债表填哪一栏
  • 全年一次性奖金并入或单独哪个好
  • 合同不交印花税怎么处理
  • 普票和专票的
  • 收入总额是什么意思
  • 交易性金融资产入账价值怎么计算
  • 购买商品的会计科目
  • 实收资本是什么科目
  • 没有抄税会导致什么情况
  • 损益类科目没有结平是什么意思
  • 缴纳上月附加税怎么做分录
  • 申报系统中印花税报表怎么填
  • 小规模纳税人年收入不能超过多少
  • CentOS上使用Squid+Stunnel搭建代理服务器教程
  • 虚拟机怎么不能玩游戏
  • 如何关闭电脑端口
  • win10mobile下载官网
  • win10快捷键合集
  • win11注意
  • linux的含义
  • ES6中javascript实现函数绑定及类的事件绑定功能详解
  • JavaScript中对象方法的创建
  • 利用python进行
  • 计算机中丢失opencv_core249.dll
  • 字符串拼接join
  • unity 3d教程
  • nodemcu连接阿里云
  • javascript 性能
  • 请问各位专家金线吊乌龟有什么功效
  • 社保扣费为什么忽高忽低
  • 发票明细怎么导入开票系统里
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设