0

这是我正在研究的笔。如果你会看到笔,第一个容器有一个子 div 没有显示在结果中。Jquery 如下,

$('.content-canvas').find('div').hide();
$('.content-canvas div:first-child').show();
$('.tab-button span:first-child').addClass('active');
$('.tab-button').find('span').click(function(){
  $('.tab-button').find('span').removeClass('active');
  var currentclass=$(this).attr('class');
  $(this).addClass('active');
 $('.content-canvas').find('div').each(function(){
    if($(this).attr('class')==currentclass)
    {
      $('.content-canvas').find('div').hide();
      $(this).slideDown(200);
      $(this).children().show(200);
    }
    else
    {
      $(this).hide();
    }
});
});
4

2 回答 2

1

这是因为在您的 js 代码的开头,您隐藏了每个 div。通过使用类似的东西来展示它:

$('.content-canvas .content1 div').show();

或者把你的'as'放在一个跨度而不是一个div中,例如:

<span>as</span>

请检查我的小提琴

于 2013-09-11T07:56:22.723 回答
1

第一行:

$('.content-canvas').find('div').hide();

改成

$('.content-canvas > div').hide();

对您使用的所有相同选择器执行相同操作。你只需要隐藏direct descendant,而不是全部divs

另外,我建议将此选择器缓存到一个变量中:

var elements = $('.content-canvas > div').hide();
...
...
element.each(function() {
...

等等,这样你就不必每次都跳入 DOM。

于 2013-09-11T11:35:44.300 回答