javascript - tooltips - tooltip input bootstrap

Bootstrap: Colapso y Tooltip juntos

Question

Quiero saber si es posible tener información sobre herramientas en una etiqueta de anclaje de colapso. El código que se usa para el colapso es:

<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">Data</a>

Funciona bien, pero ahora quiero agregarle información sobre herramientas. Así que cambié el código a:

<a data-toggle="collapse tooltip" title ="Tooltip Message" data-parent="#accordion" href="#collapseOne">Data</a>

Ahora muestra la información sobre herramientas, pero la función de colapso no funciona. Qué cambios tengo que hacer para que ambas funcionalidades funcionen. Sé que el texto de la etiqueta de anclaje puede mostrar el mensaje que quiero usar como mensaje de información sobre herramientas, pero solo quiero saber si es posible tener ambas funciones juntas.

Answer 1

Desde la página de resumen de Javascript de Bootstrap :

Atributos de datos de componentes

No utilice atributos de datos de varios complementos en el mismo elemento. Por ejemplo, un botón no puede tener una información sobre herramientas y cambiar un modal. Para lograr esto, use un elemento de envoltura.

Prueba esto:

<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
  <span data-toggle="tooltip" title="Tooltip Message">Data<span>
</a>

Answer 2

Otra solución es cambiar el disparador de información sobre herramientas. El disparador predeterminado es:

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

Que funcionará así:

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>

Pero puedes cambiarlo a:

$(function () {
  $(''[data-tooltip="true"]'').tooltip()
})

Que funcionará así:

<button type="button" class="btn btn-default" data-tooltip="true" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>