我尝试向popover添加按钮,以便用户复制内容 我设法构建了原型:http://jsfiddle.net/Misiu/VUZhL/890/ 但是当我在popover中使用tipsy时我有一些奇怪的错误:
点击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是否在正确的位置初始化?我之前不能这样做,因为第一次显示弹出窗口时会添加按钮。