Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

136
Vistas
Evento de devolución de llamada de la pestaña Bootstrap

Bootstrap tab nav-tabs función de clic de devolución de llamada,

 <ul class="nav nav-tabs"> <li class> <div> <a href="#logo"></a> </div> </li> <li class = "active"></li> <li class></li> </ul> <div id="logo"> </div>

Aquí quiero agregar mi función personalizada cada vez que cambie la pestaña,

about 4 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

Debe usar los oyentes show.bs.tab y shows.bs.tab:

 $('.nav-tabs').find('a').on('show.bs.tab', function () { // Some code you want to run when tab is clicked (before the tab is shown) }); $('.nav-tabs').find('a').on('shown.bs.tab', function () { // Some code you want to run after the tab is shown (callback) });

Otras opciones y oyentes disponibles aquí: W3Schools bootsrap tabs

about 4 years ago · Santiago Trujillo Denunciar

0

Pruebe el siguiente código, de referencia

 <script type="text/javascript"> $(document).ready(function(){ $("#myTab a").click(function(e){ e.preventDefault(); $(this).tab('show'); }); }); </script>
about 4 years ago · Santiago Trujillo Denunciar

0

¿Estás buscando algo como esto?

 $(document).ready(function(){ // Listen with the jQuery to the tabs click: $('#myTabs a').click(function (link) { console.log(link.currentTarget.innerText); }) })
 <!-- Latest compiled and minified CSS for Bootstrap --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <!-- Latest compiled and minified JS for JQuery --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!-- Latest compiled and minified JS for Bootstrap --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <ul class="nav nav-tabs" id="myTabs"> <li class="active"><a data-target="#home" data-toggle="tab">Home</a></li> <li><a data-target="#profile" data-toggle="tab">Profile</a></li> <li><a data-target="#messages" data-toggle="tab">Messages</a></li> <li><a data-target="#settings" data-toggle="tab">Settings</a></li> </ul> <div class="tab-content"> <div class="tab-pane active" id="home">Home content</div> <div class="tab-pane" id="profile">Profile content</div> <div class="tab-pane" id="messages">Message content</div> <div class="tab-pane" id="settings">Settings content</div> </div>

Lea la documentación oficial de arranque antes de publicar una pregunta como esa.

about 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda