当 jquery 聚焦时，引导工具提示不起作用

【问题标题】：bootstrap tooltip not working when jquery on focus当 jquery 聚焦时，引导工具提示不起作用
【发布时间】：2013-01-03 17:06:15
【问题描述】：

我想在复选框输入中进行引导，当关注复选框时会出现消息。所以这是我制作的代码：

html

<label class="checkbox inline"><input type="checkbox" class="centang-semua-faktur tooltip-atas" rel="tooltip"> <b>Cetak</b></label>

jquery

    var $checkAllFaktur = $('.centang-semua-faktur');

    $checkAllFaktur.on('focus', function() {
        if ($(this).is(':checked')){
            $checkAllFaktur.attr('title', 'Hapus Centang Semua').tooltip();  
        }else{
            $checkAllFaktur.attr('title', 'Centang Semua').tooltip();  
        }
    });

请帮助我。谢谢你:)

【问题讨论】：

标签： jquery twitter-bootstrap checkbox

【解决方案1】：

你需要show和destroy你的场景中的工具提示，默认情况下它们只会在mouseenter时显示，在mouseout时隐藏。

您还需要将焦点事件绑定到单击事件，以确保它在使用鼠标而不只是键盘时获得焦点。

  var $checkAllFaktur = $('.centang-semua-faktur');

$checkAllFaktur
.on('click', function() {
    $(this).trigger('focus')
})
.on('focus', function() {
    if ($(this).is(':checked')){
        $checkAllFaktur.attr('title', 'Hapus Centang Semua').tooltip('show');  
    }else{
        $checkAllFaktur.attr('title', 'Centang Semua').tooltip('show');  
    }
})
.on('blur', function(){
  $(this).tooltip('destroy');
});

工作示例： http://jsfiddle.net/MgcDU/1398/

【讨论】：