隐藏Div直到选择链接

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

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

要清楚，我不只是想让所有的孩子div（即约会，画廊等）在开始时隐藏，但主要div隐藏。 一旦选择了一个链接，那么主div应显示只显示所选的子div。

Answer 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(); });​ 

Answer 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; } 

DEMO

Answer 3

不确定你是否想要这样的东西，这是一个更新：

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