JS question de variable

Question

J'ai une fonction js très simple pour activer div visibilité, voici la version de travail:

function Toggle(obj) { 
    var state = document.getElementById(obj); 
    if (state.style.display === 'block') { 
     state.style.display = 'none'; 
    } 
    else { 
     state.style.display = 'block'; 
    } 
} 

Ici obj représente l'identifiant d'un div. Maintenant, j'ai plusieurs divs sur la page, et je veux que lorsque l'utilisateur ouvre un nouveau div, avoir déjà ouvert div fermé. J'ai essayé de le faire en modifiant ma fonction comme ceci:

var prev_obj = 'empty'; 

function Toggle(obj) { 
    var state = document.getElementById(obj); 
    if (state.style.display === 'block') { 
     state.style.display = 'none'; 
    } 
    else { 

       if (prev_obj !== 'empty') 
       { 
     var prev_state = document.getElementById(prev_obj) 
     prev_state.style.display = 'none'; 
       }  
     state.style.display = 'block'; 

       prev_obj = obj; 
    } 
} 

Je suppose que cela est explicite aux sorciers js là-bas, donc je vais juste dire, quand je coder en dur la valeur pour prev_obj, cela fonctionne , mais quand je ne le fais pas, et firebug montre qu'il garde la valeur initiale ("vide")

Aide appréciée ainsi que tout autre moyen de le faire si vous l'avez.

Answer 1

Comme je l'ai écrit dans les commentaires, je pense que la fonction est appelée à tort comme il semble que cela devrait fonctionner. Sur une autre note, vous pouvez simplifier un peu la logique, si vous considérez que ce que vous voulez est la même chose que de dire: "ferme la précédente div quoi qu'il en soit (y compris si c'est la même chose que la div actuelle), et seulement ouvrir la div actuelle si elle est différente de la précédente ".

Je voudrais également stocker l'élément réel dans prev_obj au lieu de l'ID, et le définir à null initialement. Cela rendra le test plus facile s'il y a un prev_obj, et vous permet également d'utiliser l'identifiant de "vide" si nécessaire (bien sûr, vous ne le ferez probablement pas, mais juste la meilleure pratique).

var prev_obj = null; 

function Toggle(id) { // Call it "id" to be clear it's not the actual object 
    // Hide previous object if it exists 
    if (prev_obj) prev_obj.style.display = 'none'; 

    // Show current object if it's the same as the previous one 
    var obj = document.getElementById(id); 
    if (obj !== prev_obj) { 
     obj.style.display = 'block'; 
     prev_obj = obj; 
    } 
} 

Assurez-vous l'appelez en incluant des guillemets simples autour de l'ID:

<div onclick="Toggle('div-id-here')"></div> 

Answer 2

Il est difficile de savoir où se situe votre problème à partir des détails fournis. Vous devriez être capable de développer une solution avec le tutoriel lié ci-dessous. Personnellement, je bouclerais tous les divs, les cacherais tous, puis montrerais l'actuel au lieu de tenir une référence à la dernière div.

http://www.randomsnippets.com/2008/02/12/how-to-hide-and-show-your-div/