前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >解决在bootstrap模态框modal里使用clipboard.js时复制失效

解决在bootstrap模态框modal里使用clipboard.js时复制失效

作者头像
Xcnte
发布2021-12-14 11:02:20
2.2K0
发布2021-12-14 11:02:20
举报
文章被收录于专栏:Blog记录

前言

最近在写网站项目时,遇到一个问题

当我在bootstrap模态框modal中使用clipboard.js时,复制功能不起作用,但是在模态对话框之外的使用却没有任何问题

而从其他元素复制文本时复制功能依旧有效,但如果我从属性复制文本,却不起作用,data-clipboard-text属性失效

正文

后来发现是由于Bootstrap的模态强制执行焦点,导致第三方库(包括Clipboard.js)出现问题

通过执行以下操作来关闭此功能

Bootstrap 3

代码语言:javascript
复制
$.fn.modal.Constructor.prototype.enforceFocus = function() {};

Bootstrap 4

代码语言:javascript
复制
$.fn.modal.Constructor.prototype._enforceFocus = function() {};

版权属于:Xcnte' s Blog(除特别注明外)

本文链接:https://cloud.tencent.com/developer/article/1918386

本站文章采用 知识共享署名4.0 国际许可协议 进行许可,请在转载时注明出处及本声明!

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 前言
  • 正文
    • Bootstrap 3
      • Bootstrap 4
      领券
      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档