Question

我有这段代码：

<div class="fascia">
    <div class="elements">
        <h3 class="titolo"><a href="/link">Title</a></h3>
        <div class="desc"><a href="/link">Desc</a></div>
    </div>
    <a id="photo" href="/link">&nbsp;</a>
</div>

现在我想在每次使用光标悬停fascia的每个元素时进行“警告”，我该怎么办？

Answer 1

假设我已正确理解您的问题，您只需将mouseover事件处理程序绑定到.fascia即可。由于DOM事件在DOM中冒泡，因此子级上的mouseover事件将冒出.fascia并且将触发处理程序：

$(".fascia").mouseover(function() {
    alert("Mouse over!"); 
});

根据评论

修改

如果您希望事件仅限于.fascia而非.fascia本身的子项，则可以使用children方法：

$(".fascia").children().mouseover(function() {
    alert("Mouse over!"); 
});

Answer 2

请参阅jQuery hover方法，例如：

$(".fascia").children().hover(function() {
  alert('on hover!');
});

Answer 3

$("div.fascia").children().hover(function(){alert("test");});

请参阅demo

您可能希望将过滤器选择器传递给子方法（即children("div")）以避免选择所有子项（子项及其子项等，您将为所有子项提供多个警报）

Answer 4

如果有不寻常的东西，像容器div不占用儿童的空间。高度较小或具有不同的位置。 '*'可用于定位所有元素，如

$('.fascia *').live('mouseover', function(){
  alert('hi');
});

如何处理元素的任何子级（在任何级别）

4 个答案: