Machen Sie die ausgewählte Registerkarte aktiv und bleiben inaktiv mit reinem Javascript nicht jquery

Question

Bin mit den dynamischen Tabs dort könnte mir 'n' Anzahl der Registerkarten in der Lage sein, die Registerkarte zu erfassen, wenn es geklickt und ändern Sie die Hintergrundfarbe auf grün. Aber wenn ich die andere Registerkarte wähle, bleibt die Registerkarte, die vorher geklickt wurde, auch in grün, aber inaktive Registerkarten sollten in weißem Hintergrund sein.

Answer 1

Sie können ungesetzt Hintergrund aller Registerkarten und dann die Hintergrundfarbe der ausgewählten Registerkarte wie folgt hinzu:

function showActiveTab(item) 
    { 
    var el = document.getElementsByTagName("LI"); 

    // Unset background color of all tabs to white 
    for (var i = 0, len = el.length; i < len; i++) { 
     el[i].style.background="white"; 
    } 
    // Add background color of selected tab to green 
    item.style.background="green"; 
    } 

Answer 2

Spur, die Registerkarte wie diese aktiv ist und nur den Hintergrund auf weiß gesetzt (oder was auch immer Sie mögen) wenn es sich ändert.

var activeTab = null; 
function showActiveTab(item) 
{ 
    if (null != activeTab) { 
     activeTab.style.background="white"; 
    } 
    item.style.background="green"; 
    activeTab = item; 
} 

Kleine Änderung clickTabEvent den anonymen Methodenaufruf zu entfernen, die Sie

seine Arbeits

function clickTabEvent() 
{ 
    var el = document.getElementsByTagName("LI"); 
    for (var i = 0, len = el.length; i < len; i++) { 
     var item = el[i]; 
     if (item.id && (item.id.indexOf("tab_")!=-1)) { 
      item.addEventListener('click', 
       function() { 
        showTabPanel(this); 
        showActiveTab(this); 
       } 
      ); 
     } 
    } 
}