弹出窗口关闭后,弹出窗口内的工具提示会停留 - ZeroClipboard

时间:2014-09-03 09:35:51

标签: javascript jquery twitter-bootstrap-3 zeroclipboard

我尝试向popover添加按钮,以便用户复制内容 我设法构建了原型:http://jsfiddle.net/Misiu/VUZhL/890/ 但是当我在popover中使用tipsy时我有一些奇怪的错误:

enter image description here

点击Click for action按钮后,我会弹出2个按钮,它们都有工具提示,有时候点击按钮工具提示后仍然可见。

我的代码:

$(function () {
    $('#example').tipsy({
        title: 'data-tipsy-title',
        gravity: function () {
            return this.getAttribute('data-tipsy-gravity') || 'n';
        }
    });

    $(document).on('click', '#example, .tip', function (event) {
        $(this).tipsy("hide");
    });
    $('#example').popover({
        placement: 'top',
        title: '',
        html: true,
        template: '<div class="popover" role="tooltip"><div class="arrow"></div><div class="popover-content no-padding"></div></div>',
        content: '<div class="btn-group">' +
            '<button type="button" title="link" class="btn btn-default tip number"><span class="fa fa-link"></span></button>' +
            '<button type="button" class="btn btn-default tip" title="something else"><span class="fa fa-copy"></span></button>' +
            '</div>'
    });

    $('#example').on('shown.bs.popover', function () {
        //tipsy
        $('.tip').tipsy({
            gravity: 's'
        });
        //zero clipboard
        var clip = new ZeroClipboard($(".tip"));
        clip.on("copy", function (event) {
            var clipboard = event.clipboardData;
            var data = "";
            if ($(event.target).hasClass("number")) {
                data = "1st button"+new Date()
            } else {
                data = "second";
            }
            clipboard.setData("text/plain", data);
            ZeroClipboard.deactivate();
        });
    })

    //zero clipboard
    ZeroClipboard.config({
        hoverClass: "hover"
    });
});

我的问题:
1.如何解决这个问题? 2. ZeroClipboard是否在正确的位置初始化?我之前不能这样做,因为第一次显示弹出窗口时会添加按钮。

0 个答案:

没有答案