点击按钮里面的qtip hide工具提示

Question

我在qtip工具提示中有一个按钮，可以在点击它时删除目标对象。但删除目标对象（日历事件）后工具提示保持可见。如何删除/隐藏工具提示？ 以下是qtip选项和屏幕截图。

var content = '<button class="btn btn-xs btn-default delCalendarEvent" id="' + event._id + '"><i class="fa fa-trash"></i></button>'; element.qtip({ show: { event: 'click', solo: true }, hide: { event: 'click unfocus' }, content: content, style: { classes: 'qtip-bootstrap' }, position: { my: 'bottom center', at: 'top center', container: $('.fc') } });

Answer 1

您可以尝试使用函数生成内容，如下所示：

  $('a[title]').qtip({show: {
        event: 'click',
        solo: true
    },
    hide: {
        event: 'click unfocus'
    },
    content: function() { 
      var context = this.context;
      var btn = $('<button class="btn btn-xs btn-default delCalendarEvent" id="55">X</button>');
      btn.click(function () { 
        $(context).qtip().destroy();
        $(context).remove();
      })
      return btn;
    },
    style: {
        classes: 'qtip-bootstrap'
    },
    position: {
        my: 'bottom center',
        at: 'top center',
        container: $('.fc')
    }
  });

JSFiddle：http://jsfiddle.net/tnmj7w1p/