bootstrap不提供剪贴板功能，需依赖clipboard.js或navigator.clipboard.writetext()；模态框中失效因初始化时dom未就绪，须在shown.bs.modal后指定container绑定；现代api需用户手势触发且仅限安全上下文，移动端ios建议降级至临时textarea方案。
Bootstrap 本身不提供剪贴板 API，所有「点击复制」功能都依赖外部库（如 clipboard.js）或原生 document.execCommand('copy')（已废弃）或现代 navigator.clipboard.writeText()。直接用 Bootstrap 类名写个按钮，不配逻辑，是无法复制的。
为什么 clipboard.js 在 Bootstrap 模态框里容易失效
常见现象：模态框弹出后，点击复制按钮没反应，控制台无报错，success 事件也不触发。
根本原因不是 Bootstrap 本身，而是 clipboard.js 初始化时默认在 document.body 查找目标元素；而模态框（如 #myModal）是动态插入的 DOM 片段，且可能被 display: none 或 z-index 隔离，导致初始化时找不到按钮，或焦点脱离上下文。
解决方式必须显式指定 container 参数：
- 确保模态框 DOM 已存在（比如在
shown.bs.modal事件后初始化） - 用
container: document.getElementById('myModal')显式绑定作用域 - 避免在
$(document).ready()里全局初始化所有.btn，否则模态框未打开时按钮不可见，绑定会失败
navigator.clipboard.writeText() 替代方案是否更可靠
现代浏览器（Chrome 66+、Firefox 63+、Edge 79+、Safari 16.4+）支持该 API，无需第三方库，但有硬性限制：
- 必须在用户手势（如
click、touchend）回调中调用，不能异步延迟（比如setTimeout包裹后就失败） - 必须是安全上下文（
https://或localhost），http://非本地环境会直接拒绝 - 返回 Promise，需
await或.then()处理，错误类型为NotAllowedError（权限拒绝）、ReadabilityError（读取失败）等，不能靠alert简单兜底
示例写法：
document.querySelector('#copyBtn').addEventListener('click', async () => {
try {
await navigator.clipboard.writeText(document.getElementById('targetInput').value);
console.log('复制成功');
} catch (err) {
console.error('复制失败:', err.name);
}
});
Bootstrap 表格（BootstrapTable）中加复制按钮的坑
在 data-formatter 函数里拼 HTML 字符串生成按钮（如 <button data-clipboard-text="xxx"></button>），看似简单，实则埋雷：
- 如果表格开启分页或虚拟滚动，DOM 是懒加载的，
new ClipboardJS('.btn')早于单元格渲染完成，就会漏绑 -
data-clipboard-text值含双引号、换行、HTML 实体（如&）会导致属性截断或解析失败，应先encodeURIComponent或服务端转义 - 多个模态框共用同一类名（如
.btn）时，未隔离container，可能误触发其他框里的复制逻辑
推荐做法：在 onPostBody 回调中重绑，或改用事件委托（document.addEventListener('click', ...)），再根据 e.target.dataset.clipboardText 提取内容。
移动端 iOS Safari 的特殊处理
iOS 16.4+ 虽支持 navigator.clipboard，但对 <input> 和 <textarea></textarea> 的 .select() + execCommand 组合仍更稳定（尤其在非 HTTPS 的调试场景）。而 clipboard.js 默认不兼容 iOS 的 focus/selection 行为，容易静默失败。
若必须兼容老 iOS 或混合 WebView 场景，建议降级路径：
- 优先尝试
navigator.clipboard.writeText() - 捕获
NotAllowedError后，退回到创建临时<textarea></textarea>、.select()、document.execCommand('copy')流程 - 注意：iOS 中
execCommand必须在真实用户点击内同步执行，不能包裹在Promise.then或setTimeout中
真正难的从来不是“怎么写一行复制代码”，而是判断当前运行环境、DOM 生命周期、权限状态和 fallback 路径是否全部覆盖到位——这些细节一旦漏掉一个，用户点十次都没反应。
