Javascript Jquery鼠标悬停在子对象上触发

我已经阅读了stack上关于类似主题的每一篇文章，其中有很多，但似乎没有一篇能为我解决这个问题

基本上，我有一个ul的div包含一个图像，悬停时我会触发一个50%不透明度的淡入淡出。这是没有问题的。现在，对于其中一个div，我有第二个图像，绝对位于div的中心。当我将鼠标悬停在所述div上时，会触发鼠标悬停，但是当指针经过第二个图像上方时，它会重新触发事件

请查找下面的代码

JQuery

jQuery('.lighter').mouseover(function() {
    jQuery(this).fadeTo(200, 0.5);
});
jQuery('.lighter').mouseout(function() {
    jQuery(this).fadeTo(200, 1);
});

html

等等，毫无效果

---

如果有人能提供见解或指出我所遗漏的明显错误，我将不胜感激。

似乎是因为在动画中添加了一个停止点解决了这个问题

jQuery('.lighter').mouseover(function() {
    jQuery(this).stop().fadeTo(200, 0.5);
});
jQuery('.lighter').mouseout(function() {
    jQuery(this).stop().fadeTo(200, 1);
});

如果有人想评论的话，我不太确定这是怎么解决的

您需要使用和

或者，简而言之

$('.lighter').hover(function(){
  $(this).fadeTo(200, 0.5);
}, function(){
  $(this).fadeTo(200, 1);
});​

使用

.stop（）

的实际解决方案只会使眼睛看不到它，但如果记录函数的触发，则会看到它一直保持不变

---

.

这（第二个事件）是“事件冒泡”的结果-您可能需要查找它。基本上，在子元素（中间/生产周）上触发的事件将“冒泡”到父元素（打火机）。[我很乐意详细说明这一点，但我认为谷歌搜索将涵盖你的问题]看看。Mouseenter和Mouseleave是建议使用的事件。（还有，接下来的一点建议..我很确定在a标记中嵌套div是无效的html）是的，mouseenter和mouseleave将避免事件冒泡。（这就是他们在jQuery中存在的理由）。而且，是的，将块级元素嵌套在内联元素中是无效的HTML。请参见上文中的RE mouseenter，关于嵌套，它是一个只包含内部的页面（我在过程中跳过了一些验证规则），我以前尝试过mouseenter，但遇到了相同的问题，尝试过悬停函数并收到了“uncaughtsyntaxerror:意外标记非法”可能是页面主要运行的一些副作用prototype@Xand94，或者您有一个打字错误；）似乎是一个伪装成空白的流浪角色在复制过程中渗透到了我的剪贴板！它现在工作得很好。谢谢！

jQuery('.lighter').mouseover(function() {
    jQuery(this).stop().fadeTo(200, 0.5);
});
jQuery('.lighter').mouseout(function() {
    jQuery(this).stop().fadeTo(200, 1);
});

$('.lighter').mouseenter(function() {
  $(this).fadeTo(200, 0.5);
});
$('.lighter').mouseleave(function() {
  $(this).fadeTo(200, 1);
});​

$('.lighter').hover(function(){
  $(this).fadeTo(200, 0.5);
}, function(){
  $(this).fadeTo(200, 1);
});​