引导CSS与qtip2的奇怪冲突

Question

我有一个非常奇怪的bug当使用Bootstrap css与qtip2:

我有一个按钮，我绑定了一个qtip弹出:

<button type="button" class="btn btn-default" id="deleteButton">
    Delete
</button>

我像这样绑定qtip(工作正常)

var $button = $("#deleteButton");
$button.qtip({
    show: {
        event: 'mouseenter',
        solo: true,
        effect: false,
        delay: 100
    },
    content: function (event, api) {
         return "Tooltip message";   
    }
});

一旦按钮获得css类disabled(只有类，而不是属性)，qtip就停止工作。

这是jsfield

重要:如果按钮没有btn类，即使有disabled类，qtip仍然有效。所以这个问题与Bootstrap btn类有关?

Answer 1

在bootstrap.min.css中查找

.btn.disabled, .btn[disabled], fieldset[disabled] .btn {
    cursor: not-allowed;
    pointer-events: none;
    opacity: .65;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none;
}

或者像这样重写引导样式jsfiddle