0

我有一个隐藏/显示导航工作，但似乎无法弄清楚如何隐藏包含所有子 div 的主 div，直到选择导航中的链接之一。

请看我的小提琴：http: //jsfiddle.net/blahblahAMYblah/KptZ6/

需要明确的是，我不仅希望在开始时隐藏所有子 div（即 about、gallery 等），还希望隐藏主 div。选择链接后，主 div 应该只显示选定的子 div。

4

3 回答 3

2

最初只需隐藏 div，然后在单击项目时显示它

$('body').on('click','nav a', function(e) {
    $('#main').css('display', 'block');
    $('#main').children().addClass('hide');
    $($(this).attr('href')).removeClass('hide');
    e.preventDefault();
});

#main{
    display:none;
}

演示

于 2012-08-28T23:28:16.823 回答
1

我已经更新了你的小提琴；

http://jsfiddle.net/KptZ6/2/

如果您不想更改 HTML，以下将使用 javascript 隐藏主 div。它还以相同的方式隐藏孩子（使用.hide()）

http://jsfiddle.net/KptZ6/5/

$(function() {
    $('#main').hide();
});

$('body').on('click','nav a', function(e) {
    $('#main').show();
    $('#main').children().hide();
    $($(this).attr('href')).show();
    e.preventDefault();
});​
于 2012-08-28T23:27:38.227 回答
1

不知道你是否想要这样的东西，这里有一个更新：

http://jsfiddle.net/KptZ6/3/

于 2012-08-28T23:27:59.177 回答