pruebas tabs

static/main2.html

@@ -17,9 +17,9 @@
 
     <div class="wrapper">
       <div class="tab">
-        <button class="tablinks" >Tab 1</button>
-        <button class="tablinks" >Tab 2</button>
-        <button class="tablinks" >Tab 3</button>
+        <button class="tablinks" onclick="openTab(event, 'tab1')">Tab 1</button>
+        <button class="tablinks" onclick="openTab(event, 'tab2')">Tab 2</button>
+        <button class="tablinks" onclick="openTab(event, 'tab3')">Tab 3</button>
       </div>
       <div id="tab1" class="tabcontent">
         <div class="chat" id="chat1"></div>
@@ -56,26 +56,26 @@
     $(document).ready(function() {
       chatH = new ChatGPT("{% token %}");
       windH = new WindowHandler();
-
-      $(function() {
-        // Al cargar la página se muestra el primer tab y se activa su botón correspondiente
-        $('.tabcontent:first-child').show();
-        $('.tablinks:first-child').addClass('active');
-        
-        // Al hacer clic en un botón de tab se muestra su contenido correspondiente
-        $('.tablinks').click(function(e) {
-          e.preventDefault();
-          $('.tabcontent').hide();
-          $('.tablinks').removeClass('active');
-          $(this).addClass('active');
-          var tab = $(this).attr('href');
-          $(tab).show();
-        });
-      });
-    });
-
-    
-
-  </script>
+      
+      
+      
+      
+      function openTab(evt, tabName) {
+              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(tabName).style.display = "block";
+              evt.currentTarget.className += " active";
+            }
+    </script>
 </body>
 </html>