jquery - 使用 ZeroClipboard 引导模态遥控器

Question

我使用 twitter bootstrap 3.0s 模态视图来显示一个实现了 zerclipboard 的 html。[https://github.com/zeroclipboard/ZeroClipboard]

这个 html 有一个点击按钮，某些内容应该通过 zeroclipboard 复制到剪贴板。

ZeroClipboard.setDefaults({
    moviePath : '../js/lib/ZeroClipboard.swf',
    hoverClass : "zeroclipboard-is-hover", // The class used to hover over the object
    activeClass : "zeroclipboard-is-active",
});

var clip = new ZeroClipboard($('#btn-copy-cb'));

clip.on('dataRequested', function(client, args) {
    clip.setText($("#text-code").text());
});

clip.setHandCursor(true);

html 本身工作正常。但是当它通过模态视图调用时

$('#my-modal').modal({
    show: false,
    remote: "copytoclipboard.html"
});

当我将鼠标悬停在按钮上或单击它时给我一个错误。

TypeError: this.htmlBridge is undefined


...e._singleton},p.detectFlashSupport=function(){var a=!1;if("function"==typeof Act...

Answer 1

加载模态内容后尝试设置 zerclip 板：

$('#my-modal').on('shown.bs.modal', function () {

var clip = new ZeroClipboard($('#btn-copy-cb'));

clip.on('dataRequested', function(client, args) {
    clip.setText($("#text-code").text());
});

clip.setHandCursor(true);

});

当提供远程 URL 时，内容将通过jQuery 的加载加载。由于加载是异步的，您也可以尝试覆盖它并添加“完成”。