Javascript 在Mouseover上为嵌套div执行函数

我展示了一个示例代码：

<div onmouseover="function1(e)">
   SomeContent 1
   <div onmouseover="function2(e)"> SomeContent 2</div>
</div>

部分内容1
内容2

这里，当鼠标上方位于内部div上时，将同时执行

function1（）

和

function2（）

。如果鼠标位于内部div上，则只应执行

function2（）

。 我甚至还尝试过使用

e.stopPropagation（）

---

任何帮助都将受到感谢。

这对我很有用。这有用吗？“window.event”是可用于onclick的对象，而不是“window.e”

var function1=function（）{
控制台日志（“func1”）；
}
变量函数2=函数（e）{
e、 停止传播（）；
console.log（“func2”）；
}

部分内容1
内容2
stopPropagation（）对我有效。也许你用的不对

下面的代码片段也适用于（'mouseenter'，..


$（'div'）。悬停（函数（e）{
if（$（e.target）.is（'div.parent'））{
console.log（'parent'）；
e、 停止传播（）；
}else if（$（e.target）.is（'div.child'））{
console.log（'child'）；
}
})；

部分内容1
内容2
因为您使用的是JQuery，所以我建议您使用：

说明：将一个或多个事件的事件处理程序函数附加到所选元素

而不是被认为是错误做法的内联事件处理程序，例如：


$（'content_1'）。在（'mouseover'，函数（e）上{
$（'控制台'）.text（'函数1'）；
});
$（'#content_2'）。on（'mouseover'，函数（e）{
e、 停止传播（）；
$（“#控制台”）.text（'function2'）；
})；

部分内容1
内容2