Afficher un div dans un caché div

Question

J'ai deux divs dans un div et je veux montrer qu'un seul à la fois

<div class="songContent"> 
    <div id="song1"> song 1 </div> 
    <div id="song2"> song 2</div> 
</div> 

Et je déclenche l'événement d'un autre élément en utilisant cette fonction: (passage de la chaîne comme argument à la fonction, ex: SongID = Song1)

function showSong(songId){ 
    $('.songContent div').hide(); 
    var sel = '#'+songId; 
    $(sel).show() 
    $(sel +' div').show() 
    alert(sel);    //debugging 
} 

Toute aide serait appréciée, Merci,

Answer 1

function showSong(songId){ 
    $('.songContent div').hide(); 
    $('div[id=' + songId + ']').show(); 
} 

Answer 2

Quelque chose comme ça?

function showSong(songId){ 
    $('#'+songId).show().siblings().hide(); 
} 

Answer 3

Si vous construisez une chaîne de sélection qui ressemble à #song1 div, il ne trouvera pas votre song1 div. Vous avez besoin de quelque chose comme div#song1.

Exemple:

function showSong(songId){ 
    $('.songContent div').hide(); 
    var sel = '#'+songId; 
    $('div' + sel).show() 
} 

Mais le sélecteur par id par lui-même (sel) aurait travaillé comme un sélecteur.

Answer 4

Si vous n'en avez qu'une affichée à la fois au démarrage, vous pouvez simplement utiliser la bascule.

$('#show').click(function(){ 
     $('div[id^=song]','#songContent').toggle(); 
});