位置: 编程技术 - 正文

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标志)

  • 报废的原材料
  • 税务局做社保关联带什么资料
  • 房租收入怎么报税
  • 财务担保费计入什么科目
  • 开业前所有费用叫做什么
  • 工商公示纳税总额包含个税吗
  • 拍卖公司都要交前期费用吗?
  • 生产企业固定资产折旧
  • 企业设备融资是什么意思?
  • 增值税专用发票几个点
  • 土地补偿款属于专项资金吗
  • 技术服务收入和产品服务收入举个例子
  • 所有者权是否益包括未交出资吗?
  • 收据可以入账的范围
  • 进项税额加计抵减怎么做分录
  • 非公开发行股票是利好还是利空
  • 怎样清理ie
  • PHP:mb_regex_encoding()的用法_mbstring函数
  • phpstudy如何查看错误日志
  • 赠品没有收到
  • 出卖固定资产企业处罚
  • 售后回租经营租赁可以抵扣吗
  • 股东权益增加额/期初净经营资产
  • ensmix32.exe进程安全吗 ensmix32进程是什么文件产生的
  • 哪些可以作为原始凭证
  • yii2关联查询
  • 短期资金都是债务类资金
  • php正则函数内容匹配
  • 账户维护费计入什么会计科目
  • php fgetcsv
  • 前端微信小程序支付功能怎么实现
  • web核心的三个标准
  • js中move
  • php数据统计源码
  • 合并会计报表的编制
  • phpcms官网打不开
  • 资产负债表各项目的填列依据是
  • 4s店收到红字发票怎么办
  • 多缴所得税怎么算
  • css边框实现效果图及代码
  • 低值易耗品如何界定
  • 税控盘锁死日期是什么意思
  • 资产类账户有哪些
  • 工会经费通过应交税费科目核算吗
  • 销项税用转出吗
  • 结转成本注意事项
  • 补计提去年所得税会影响当月资产
  • 出口货物备案单证目录怎么填
  • 计税成本对象的分类
  • 缴纳水土保持补偿费分录是什么
  • 扣交社保会计分录
  • 确认收入结转成本可以写在一张凭证上吗
  • 所得税费用科目的期末余额应直接转入
  • 费用分摊科目
  • 什么是长期的
  • 服务费税额部分计算公式
  • 会计一般采用什么科目
  • 平均净资产是什么意思
  • windows2008教程
  • centos挂载cd
  • 虚拟机安装win7一直卡在完成安装
  • 进程管理器命令
  • win7旗舰版没有睡眠设置
  • 电脑升级到win11会卡吗
  • ,linux
  • win7 64位纯净版图标变成了一样该怎么办?win7旗舰版图标变成一样的解决方法
  • unity读取文本文件
  • 简述opengl的编程步骤
  • cocos creator2.4
  • nodejs cgi
  • unity uishader
  • Android带有注册界面的简单app
  • js实现ping一个ip地址
  • python动态加载py
  • jQuery 中ajax异步调用的四种方式
  • jquery增加
  • 工会经费征收范围规定
  • 留底税额怎么写分录
  • 新疆税务总局网站官网
  • 用实际行动践行中国税务精神
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设