我需要在禁用按钮上显示工具提示,并在启用按钮上删除它。目前,它是反向工作的。

扭转这种行为的最好方法是什么?

$('[rel=tooltip]').tooltip(); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> <hr> <button class="btn" disabled rel="tooltip" data-title="Dieser Link führt zu Google">button disabled</button> <button class="btn" rel="tooltip" data-title="Dieser Link führt zu Google">button not disabled</button>

这是一个演示

附注:我想保留disabled属性。


当前回答

这可以通过CSS来实现。“pointer-events”属性是阻止工具提示出现的原因。你可以通过覆盖bootstrap设置的"pointer-events"属性来让禁用按钮显示工具提示。

.btn.disabled {
    pointer-events: auto;
}

其他回答

只需将禁用类(而不是disabled属性)添加到按钮,即可使其可见地禁用。

<button class="btn disabled" rel="tooltip" data-title="Dieser Link führt zu Google">button disabled</button>

注意:这个按钮只是看起来是禁用的,但它仍然会触发事件,你只需要注意这一点。

下面是一些工作代码:http://jsfiddle.net/mihaifm/W7XNU/200/

$('body').tooltip({
    selector: '[rel="tooltip"]'
});

$(".btn").click(function(e) {
    if (! $(this).hasClass("disabled"))
    {
        $(".disabled").removeClass("disabled").attr("rel", null);

        $(this).addClass("disabled").attr("rel", "tooltip");
    }
});

其思想是将工具提示添加到带有选择器选项的父元素中,然后在启用/禁用按钮时添加/删除rel属性。

我在动态控件上也有同样的问题,所以我只是简单地这样做,设置样式属性并启用只读属性= true,当我们需要禁用元素时,但如果用户单击输入按钮控件,则显示工具提示。

是禁用停止所有事件功能,如ObBlur, onClick /OnFocus。代替下面的线:

((document.getElmentByName (MYINPUTBTN) .item(0)))。禁用= true。

我们可以通过下面的代码,工具提示将在禁用输入按钮元素中启用。

((document.getElmentByName('MYINPUTBTN').item(0))).setAttribute(“style”, “background-color”: #e9ecef;“);

b

希望这能解决这个问题。

你可以简单地覆盖Bootstrap的“指针事件”样式通过CSS禁用按钮。

.btn[disabled] {
 pointer-events: all !important;
}

最好还是显式地禁用特定的按钮。

#buttonId[disabled] {
 pointer-events: all !important;
}

如果这对任何人都有帮助的话,我可以让一个禁用按钮显示一个工具提示,只需在其中放置一个span,并在那里应用工具提示的东西,angularjs围绕它…

<button ng-click="$ctrl.onClickDoThis()"
        ng-disabled="!$ctrl.selectedStuff.length">
  <span tooltip-enable="!$ctrl.selectedStuff.length"
        tooltip-append-to-body="true"
        uib-tooltip="Select at least one thing to enable button.">
    My Butt
  </span>
</button>