Control de arranque con múltiples "alternar datos"

¿Hay alguna manera de asignar más de un evento a un control de arranque a través de "alternar datos". Por ejemplo, supongamos que quiero un botón que tenga asignada una "información sobre herramientas" y un botón de "botón".
Intenté data-toggle = "botón de información sobre herramientas", pero solo funcionó la información sobre herramientas.

EDITAR:

Esto es fácilmente "solucionable" con

$("#newbtn").toggleClass("active").toggleClass("btn-warning").toggleClass("btn-success");

Si desea agregar un modal y una información sobre herramientas sin agregar javascript o alterar la función de información sobre herramientas, también puede simplemente envolver un elemento a su alrededor:

<span data-toggle="modal" data-target="modal">
    <a data-toggle="tooltip" data-placement="top" title="Tooltip">
      Hover Me           
    </a>
</span>

Dado que la información sobre herramientas no se inicializa automáticamente, puede realizar cambios en su inicialización de la información sobre herramientas. Hice el mío así:

$(document).ready(function() {
    $('body').tooltip({
        selector: "[data-tooltip=tooltip]",
        container: "body"
    });
});

con este marcado:

<button type="button" data-target="#myModal" data-toggle="modal" data-tooltip="tooltip" class="btn btn-info" title="Your tooltip">Text here</button>

Note el data-tooltip.

Actualizar

O simplemente,

$('[data-tooltip="tooltip"]').tooltip();

Logré resolver este problema sin la necesidad de cambiar ningún marcado con la siguiente pieza de jQuery. Tuve un problema similar en el que quería una información sobre herramientas en un botón que ya usaba alternar datos para un modal. Todo lo que necesitará hacer aquí es agregar el título al botón.

$('[data-toggle="modal"][title]').tooltip();

Esta es la mejor solución que acabo de implementar:

HTML

<a data-toggle="tooltip" rel="tooltip" data-placement="top" title="My Tooltip text!">Hover over me</a>

JAVASCRIPT que de todos modos debe incluir independientemente del método que utilice.

$('[rel="tooltip"]').tooltip(); 

Aún no. Sin embargo, se ha sugerido que alguien agregue esta característica algún día.

El siguiente problema de arranque de Github muestra un ejemplo perfecto de lo que deseas. Es posible, pero no sin escribir su propio código de solución alternativa en esta etapa.

Echale un vistazo... :-)

https://github.com/twitter/bootstrap/issues/7011

Utilizo href para cargar el modal y dejar la alternancia de datos para la información sobre herramientas:

<a 
    data-toggle="tooltip"
    data-placement="top"
    title="My Tooltip text!"
    href="javascript:$('#id').modal('show');"
>
+
</a>

Dado que Bootstrap te obliga a inicializar la información sobre herramientas solo a través de Javascript, cambié data-toggle="tooltip"(ya que es inútil entonces) class="bootstrap-tooltip"y usé este Javascript para inicializar mi información sobre herramientas:

$('.bootstrap-tooltip').tooltip();

Y así, era libre de usar el data-toggleatributo para otra cosa (por ejemplo data-toggle="button").

Solo por complemento @Roman Holzner responde ...

En mi caso, tengo un botón que muestra la información sobre herramientas y debe permanecer deshabilitado hasta que se realicen otras acciones. Usando su enfoque, el modal funciona incluso si el botón está desactivado, porque su llamada está fuera del botón: estoy en un archivo Blade de Laravel, solo para que quede claro :)

<span data-toggle="modal" data-target="#confirm-delete" data-href="{{ $e->id }}">
    <button name="delete" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Excluir Entrada" disabled>
        <i class="fa fa-trash fa-fw"></i>
    </button>
</span>

Entonces, si desea mostrar el modal solo cuando el botón está activo, debe cambiar el orden de las etiquetas:

<span data-toggle="tooltip" data-placement="bottom" title="Excluir Entrada" disabled>
    <button name="delete" class="btn btn-default" data-href="{{ $e->id }}" data-toggle="modal" data-target="#confirm-delete" disabled>
        <i class="fa fa-trash fa-fw"></i>
    </button>
</span>

Si desea probarlo, cambie el atributo con un código JQuery:

$('button[name=delete]').attr('disabled', false);

Una solución mas:

    <a data-toggle="modal" data-target="#exampleModalCenter">
      <span
        class="tags"
        data-toggle="tooltip"
        data-placement="right"
        title="Tooltip text"
      >
        Text
     </span>
   </a>

Hay una buena solución usando class .stretched-link. El botón debe tener una clase.position-relative . Aquí hay un ejemplo de trabajo completo:

Se debe agregar información sobre herramientas al botón; de lo contrario, su posición será incorrecta.

$('[data-toggle="tooltip"]').tooltip();

/*DEMO*/.btn{margin-left:5rem;margin-top:5rem}

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">

<!--BUTTON-->
<button class="btn btn-primary position-relative" data-toggle="tooltip" data-trigger="hover" data-placement="left" title="Tooltip text">
    <span class="stretched-link" data-toggle="modal" data-target="#exampleModal"></span>
    Click Me!
</button>

<!--DEMO MODAL-->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"><div class="modal-dialog" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title" id="exampleModalLabel">Modal title</h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body">Modal body</div></div></div></div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>

Cuando abre modal en una etiqueta y desea mostrar información sobre herramientas y si implementa información sobre herramientas dentro de la etiqueta, mostrará información sobre herramientas etiqueta cercana. Me gusta esto

Sugeriré que use div fuera de una etiqueta y use "display: inline-block;"

<div data-toggle="tooltip" title="" data-original-title="Add" style=" display inline-block;">
    <a class="btn btn-primary" data-toggle="modal" data-target="#myModal" onclick="setSelectedRoleId(6)">
     <span class="fa fa-plus"></span>
    </a>
</div>

<a data-toggle="tooltip" data-placement="top" title="My Tooltip text!">+</a>