根据事件选择父div内的特定div（悬停）

所以，我有一个父div，有7个子div。这7个div中的每一个都是一个将在悬停或点击时切换的容器。我如何将活动附加到7个div中的一个，以便只显示其内容？现在，如果我悬停，所有div的内容都会显示出来。我需要悬停并只显示hovered div的内容。根据事件选择父div内的特定div（悬停）

$('div#HoldsAll').on('hover', function(){ 
$('div.none').show(); 
}); 

<div id="HoldsAll"> 

<div class="none"> 
<p>A hover over this parent div should display only this</p> 
<p>and this</p> 
<p>and this too</p> 
</div> 
<div class="none"> 
<p>This should remain hidden</p> 
</div> 
<div class="none"> 
<p>This should remain hidden, too</p> 
</div>

来源

2012-04-22 navarro

请出示您现有的jQuery代码。 – 2012-04-22 21:17:18

@navarro尝试更新解决方案。 – undefined 2012-04-22 21:51:06

您有重复的ID（id="none"），这是不允许的，并可能导致意外的行为，如你在这里看到的是什么。

来源

2012-04-22 21:18:01

您可以更新或删除您的答案，因为有人可以降低您的问题，因为在提问者更新问题后没有重复的ID。 – KULKING 2013-02-05 15:57:11

，你应该只使用一个唯一的ID为一个独特的元素，使用class="none"：

如果格的带班没有的内容中没有元素悬停被隐藏在那里，试试这个：

CSS：

.none p {display: none;} 
span {color: red}

HTML：

<div id="HoldsAll"> 

<div class="none"> 
<span>show</span>  
<p>A hover over this parent div should display only this</p> 
<p>and this</p> 
<p>and this too</p> 
</div> 

<div class="none"> 
<span>show</span>  
<p>This should remain hidden</p> 
</div> 

<div class="none"> 
<span>show</span>  
<p>This should remain hidden, too</p> 
</div> 

</div>

的jQuery：

$(function() {    
    $('.none').hover(function() { 
     $(this).find("p").show(); 
    }, function() { 
     $(this).find("p").hide(); 
    }); 
});

http://jsfiddle.net/faNtu/

来源

2012-04-22 21:20:38 undefined

这不会工作基于这样一个简单的事实，即如果不管id或class的div是否隐藏，用户都不能将鼠标悬停在元素上。 – KryptoniteDove 2012-04-22 21:24:56

@KryptoniteDove是的，谢谢你的提示，我会修改它。 – undefined 2012-04-22 21:27:57

那么，你需要的东西悬停，使其工作，所以.none需要有一个实际大小您可以通过它得到你的小的MousePointer啄，但这样的事情可能：

$('.none', '#HoldsAll').on({ 
    mouseenter: function() { 
     $('p', this).show(); 
    }, 
    mouseleave: function() { 
     $('p', this).hide();  
    } 
});

FIDDLE

来源

2012-04-22 23:53:16 adeneo

因此，如果.none有一个CSS规则显示：无，该事件将不适用？如果是这样，我应该更改CSS并使用.hide，以便我可以使用.show或.toggle？我的主要问题是触发动作（悬停，点击div）发生在一个div内，该div是进出的几个div，远离事件目标。所以我必须摆脱一个div，找到目标div，应用这个事件。它踢了我的屁股，但再一次，我不是忍者。 – navarro 2012-04-24 00:15:41

根据事件选择父div内的特定div（悬停）

回答

相关问题