Bootstrap Tooltip erfordert Doppelklick nach dem ersten Klick

Question

Ich habe ein Problem mit Tooltips erfordern einen Doppelklick, nachdem sie einmal geklickt wurden. Zum Beispiel klicke ich auf Tooltip1, dann auf Tooltip2 und dann erneut auf Tooltip1. Das zweite Mal, wenn ich auf Tooltip1 klicke, sind zwei Klicks erforderlich, bevor der Tooltip erneut angezeigt wird.

Alles was ich suche, ist eine Seite mit 4 Tooltips, die den Tooltip anzeigen, wenn ich auf einen Link klicke und nur einen Tooltip nach dem anderen zeige. Wenn also ein Tooltip angezeigt wird, sind die anderen 3 ausgeblendet.

Ein Beispiel ist bei https://jsfiddle.net/9656mv9w/

$(document).ready(function() { 
$('[data-toggle="tooltip"]').tooltip(); 
}); 

$(document).on('show.bs.tooltip', function() { 
$('.tooltip').not(this).hide(); 
}); 

Answer 1

ich hatte das gleiche Problem. Ein Workaround-Fix erkennt alle offenen Tooltips des Show-Events, die geschlossen werden sollen, und löst dann einen Klick aus, um sie zu schließen.

//init bootstrap tooltips 
$('[data-toggle="tooltip"]').tooltip({ 
    trigger:'click' 
}); 

//listen for the show event on any triggered elements 
$('[data-toggle="tooltip"]').on('show.bs.tooltip', function() { 

//get a reference to the current element that is showing the tooltip 
    var triggeredElement = $(this); 

    //loop through all tooltips elements 
    $('[data-toggle="tooltip"]').each(function(){ 

    //if they are not the currently triggered element and have a tooltip, 
    //trigger a click to close them 
    if($(this) !== triggeredElement && $(this).next().hasClass('tooltip')) { 
     $(this).click(); 
    } 
    }) 
});