Na documentação do Bootstrap , diz que tudo que você precisa fazer para fazer uma dica de ferramenta funcionar é adicionar data-toggle="tooltip"um atributo de título ao seu elemento HTML. Então você o adiciona, atualiza a página e …. nada.
O que da?
Se você rolar para baixo um pouco, verá “Por motivos de desempenho, a ferramenta Tooltip e Popover data-apis são opt-in, o que significa que você deve inicializá-los sozinho.” E então eles dão vários exemplos onde inicializam os elementos encontrando-os por id. Não ajuda.
Então, qual é o objetivo do data-toggle="tooltip"atributo? Bem, se você adicioná-lo a um monte de elementos e quiser inicializá-los todos de uma vez, basta usar este snippet:
$( document ).ready(function() {
$('[data-toggle="tooltip"]').tooltip();
});$( document ).ready()garante que isso seja executado depois que todos os elementos no DOM forem carregados e pesquisáveis. $('[data-toggle="tooltip"]')encontra todos os elementos com um atributo data-toggle. Ele usa um seletor de atributos CSS básico (mais sobre isso aqui ). Então, finalmente, ele apenas chama .tooltip()todos os elementos que encontra para que o Bootstrap inicialize a dica de ferramenta.