在隐藏的div中显示div

Question

我在一个div中有两个div，但一次只想显示一个

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

我正在使用此函数从另一个元素触发事件：（将字符串作为函数的参数传递，例如：songId = song1）

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

任何帮助将不胜感激，谢谢，

Answer 1

像这样吗

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

Answer 2

如果您在开始时一次只显示一个，则只需使用切换即可。

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

Answer 3

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

Answer 4

如果您构建一个看起来像#song1 div的选择器字符串，它将找不到您的song1 div。 您需要类似div#song1东西。

例：

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

但是by-id选择器本身（ sel ）应该可以用作选择器。