如何用jquery 控制子div下的孙子div的样式

Question

jqueryjs

Answer 1

移动任何div$('div').hover(function(){
$('.div3').show();
   },function(){
$('.div3').hide();
   });移到div2
$('.div2').hover(function(){
$(this).find('div').show();
   },function(){
$(this).find('div').hide();
   });

Answer 2

<script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js">
</script>
<div id="div1">111
   <div class="div2">
     <div class="div3" style="display:none;">1111</div>
  </div>
   <div class="div2">
     <div class="div3" style="display:none;">2222</div>
  </div>
 <div class="div2">
     <div class="div3" style="display:none;">3333</div>
  </div>
</div>
<script>$('#div1').hover(function(){$('.div3',this).show()},function(){$('.div3',this).hide()})</script>

Answer 3

谢谢您的回复，可能是我 描述的还有问题，应该是这样的。当我鼠标移动到任何一个DIV2 的时候当前的DIV3 = show，其他div3.display = none 。

Answer 4

谢谢您的回复，可能是我 描述的还有问题，应该是这样的。当我鼠标移动到任何一个DIV2 的时候当前的DIV3 = show，其他div3.display = none 。

Answer 5

$(function(){
$('.div2').hover(function(){
            $('.div3',this).show();
       },function(){
            $('.div3',this).hide();
       });
})

Answer 6

<script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js">
</script>
<div id="div1">
   <div class="div2">d21
     <div class="div3" style="display:none;">1111</div>
  </div>
   <div class="div2">d22
     <div class="div3" style="display:none;">2222</div>
  </div>
 <div class="div2">d23
     <div class="div3" style="display:none;">3333</div>
  </div>
</div>
<script>$('.div2').hover(function(){$('.div3',this).show()},function(){$('.div3',this).hide()})</script>