2011-03-11 110 views
3

我有一個css div,並在該div內存在另一個div。當鼠標懸停在父div上時,如何獲得子div?如下所示:jquery獲取div div內的子div

<div class="parent"> 
    <div class="child"> 
    </div> 
</div> 

當鼠標移過父div時,我希望顯示子div。

回答

7

這工作:在http://jsfiddle.net/4kMuD/

$('.child').hide(); // or $('.parent').children().hide(); 

$('.parent').hover(
    function() { $(this).children('div').show() }, 
    function() { $(this).children('div').hide() } 
); 

實施例,雖然使用的ID而不是類的選擇器。

我已經假設(雖然你沒有說)你想讓孩子div再次消失,當你不再徘徊父母。

0

是這樣的?

<div id="div1"> 
     div1 
     <div id="div2" style="display:none;">div2</div> 
    </div> 

$(function(){ 
     $("#div1").hover(function(){ 
      $("#div2").show(); 
     }, function(){ 
      $("#div2").hide(); 
     }); 
    }); 
0
$('div.parent').bind('hover', 
    function(e) { $('div.child', this).show() }, 
    function(e) { $('div.child', this).hide() }, 
); 
0
<html> 
    <head> 
    <title>Tests</title> 
    <script src="jquery.js"></script> 
    <script> 
    $(document).ready(function(){ 
     $('#parent').mouseover(function() { 
      $('#child').css('display', 'block'); 
     }) 
    }); 
    </script> 
    <style> 
     #parent {width: 100px; height: 100px; background-color: yellow;} 
     #child { display:none; } 
    </style> 
    </head> 
    <body> 
     <div id="parent"> 
      <div id="child">Content</div> 
     </div> 
    </body> 
</html>