我在做一个选项卡功能,当鼠标出发mouseover之后,隐藏全部div,再显示相对应的div。但是目前出现了一个问题,就是只显示<div id="#D1"></div>中的一个元素,而不是显示<div id="#D1"></div>所有的元素。
是不是我写错了,应该怎样写才能显示#D1,#D2中的所有元素?
$(document).ready(function(){
$("#DC :not(:first-child)").hide();
$('#DesignList li').bind('mouseover',function(){
$('#DesignList li').removeClass('TS');
$(this).addClass('TS');
$('#DC div').hide();
$($(this).attr('id')).show();

});
});         <div class="BRTitle">
                <ul id="DesignList">
                        <li id="#D1" class="TS">LOGO设计</li>
                        <li id="#D2">名片设计</li>
                        <li id="#D3">单页设计</li>
                        <li id="#D4">画册设计</li>
                        <li id="#D5">包装设计</li>
                        <li id="#D6">台历设计</li>
                        <li id="#D7">手提袋设计</li>
                  </ul>
           </div>
           <div id="DC">
                    <div id="D1">
                     <img class="Pic" src="images/LOGO-1.jpg" width="180" height="180" alt="LOGO-1" />
                      <img class="Pic" src="images/LOGO-2.jpg" width="180" height="180" alt="LOGO-1" /><span>W</span></div>
                    <div id="D2"><img class="Pic" src="images/LOGO-2.jpg" width="180" height="180" alt="LOGO-2" /> abb <img class="Pic" src="images/LOGO-2.jpg" width="180" height="180" alt="LOGO-2" />12312312s</div>
                    <div id="D3"><img class="Pic" src="images/LOGO-3.jpg" width="180" height="180" alt="LOGO-3" /></div>
                    <div id="D4"><img class="Pic" src="images/LOGO-4.jpg" width="180" height="180" alt="LOGO-4" /> <img class="Pic" src="images/LOGO-4.jpg" width="180" height="180" alt="LOGO-4" /></div>
                    <div id="D5"></div>
                    <div id="D6"></div>
                    <div id="D7"></div>
          </div>

解决方案 »

  1. 补充,上述代码运行结果,默认只能显示#D1中的第一张图片,
    当鼠标移动到<li id="#D2">名片设计</li>上时,只能显示<div id="D2"></div>中的第一张图片和没有任何标记的文本内容
      

  2. $("#DC :not(:first-child)").hide(); // 这句把其他所有的都隐藏了
      

  3. 上句是都隐藏了,但是我在出发mouseover事件时会显示某个div 啊,但是只能显示div中的第一张图片,其他图片显示不出来。
      

  4. 是所有的元素包括子元素都隐藏了,你把那句注释了,看看就明白了。用firebug调试看看更好,show只显示了div,但他的子元素还是隐藏的。
      

  5. $("#DC > div:not(:first-child)").hide();
      

类似问题 »