Estoy tratando de mantener abierta la pestaña actual después de enviar un formulario o actualizar la página, pero no puedo.
Ya vi un tono de respuestas con respecto a este problema, pero mi caso es un poco diferente porque no usé ul y li o incluso un href en mis pestañas. Usé botones. A continuación se muestra mi código:
HTML
<div class="tab"> <button class="tablinks colora" onclick="tabsetting(event, 'London')" id="defaultOpen">General settings</button> <button class="tablinks color1" onclick="tabsetting(event, 'Paris')">Attendance sheet settings</button> <button class="tablinks color0" onclick="tabsetting(event, 'Tokyo')">Certificate settings</button> <button class="tablinks color01" onclick="tabsetting(event, 'Douala')">Certificate templates</button> </div> <div id="London" class="tabcontent"> </div>JavaScript
function tabsetting(evt, cityName) { var i, tabcontent, tablinks; tabcontent = document.getElementsByClassName("tabcontent"); for (i = 0; i < tabcontent.length; i++) { tabcontent[i].style.display = "none"; } tablinks = document.getElementsByClassName("tablinks"); for (i = 0; i < tablinks.length; i++) { tablinks[i].className = tablinks[i].className.replace(" active", ""); } document.getElementById(cityName).style.display = "block"; evt.currentTarget.className += " active"; } // Get the element with id="defaultOpen" and click on it document.getElementById("defaultOpen").click();¿Cómo hago para que la pestaña actual permanezca abierta después de actualizar la página o enviar el formulario que está dentro de una de las pestañas?
Hola encontré una solución a mi pregunta. Lo estoy pegando aquí para que cualquiera pueda aprender:
$('.tablinks').click(function(){ var activetab = $(this).attr('id'); localStorage.setItem('activetab', activetab ); }); $(function() { //short hand for $(document).ready() var activetab = localStorage.getItem('activetab'); document.getElementById(activetab).click(); });