`
san_yun
  • 浏览: 2653019 次
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

js事件冒泡问题

 
阅读更多
今天在实现首页图片提示时遇到onmouseout和onmouseover问题折腾了我很久,后来才知道这是js事件冒泡导致了。

什么事js事件冒泡?

在层的鼠标事件中,如果层内部带有链接或表格等其它html时,鼠标挪到上面就会触发onmouseout事件,虽然看来是没有挪出层的区域,


比如在这个层中,我需要实现鼠标放在图片上能出现层提示。
 $('.piece-bd li').bind("mouseover",function(){
	$(this).find(".video-bg p").slideDown('fast'); 
});

 $('.piece-bd li').bind("mouseout",function(){
	$(this).find(".video-bg p").slideUp('fast'); 
});



但发现很有问题,当鼠标没有移除层的时候也触发了onmouseout事件。

解决这个问题很简单,只需要改成mouseenter,mouseleave。
  • 大小: 14.9 KB
分享到:
评论

相关推荐

    javascript阻止事件冒泡的一种方法

    JavaScript中的事件冒泡是事件处理的一个重要概念,它是指事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上转播至最不具体的节点(文档)的过程。这个机制允许事件在事件流的每个阶段都...

    JS事件冒泡浏览器兼容

    总结一下,JavaScript事件冒泡是浏览器中处理用户交互的重要机制,但它在不同浏览器间存在兼容性问题。通过使用DOM2级事件接口和编写兼容性代码,可以有效地管理这些差异,确保在各种浏览器环境下都能正确处理事件。...

    阻止滚动条事件冒泡

    要实现这个功能,我们需要理解JavaScript事件冒泡的概念。在DOM中,事件会从最深的节点开始向上层节点传播,直到到达文档的根节点,这个过程就称为事件冒泡。阻止事件冒泡可以避免一个事件被多次处理,提高性能,...

    事件冒泡解决方案

    在JavaScript的DOM编程中,事件冒泡是一个非常重要的概念,尤其在处理多级嵌套元素的事件时。事件冒泡是指事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上转播至最不具体的节点(文档...

    JavaScript事件冒泡与取消事件冒泡代码演示

    本段代码演示了如何使用JavaScript取消HTML事件的冒泡,即当后代元素的事件被触发时,祖先元素的相同事件也会被触发。代码中,页面包含一个div元素和一个嵌套在其中的span元素,分别设置了单击响应函数。当单击span...

    利用事件冒泡(Event Bubbling )获取鼠标下的元素属性

    在JavaScript编程中,事件处理是不可或缺的一部分,尤其是事件冒泡(Event Bubbling)机制,它是理解DOM(Document Object Model)事件处理的关键概念之一。事件冒泡是指事件开始时由最具体的元素(文档中嵌套层次...

    JavaScript事件冒泡示例.html

    JavaScript事件冒泡是Web开发中的一个关键概念,它在网页交互和动态效果中扮演着重要角色。事件冒泡源于浏览器处理事件的方式,当一个事件(如点击、鼠标移动等)在一个元素上触发时,该事件会自底向上沿着DOM树...

    事件冒泡

    通过阅读源码,开发者可以更深入地理解事件冒泡的工作原理,从而优化性能或解决兼容性问题。 至于标签"工具",可能是指有一些开发工具可以帮助我们调试和观察事件冒泡的过程。例如,浏览器的开发者工具提供了事件...

    JavaScript 事件冒泡简介及应用

    总之,JavaScript的事件冒泡机制为网页交互提供了一种高效、灵活的事件处理模型,使得开发者可以方便地管理和响应用户的操作,同时也要注意不同浏览器之间的兼容性和优化问题。理解并掌握事件冒泡对于提升Web应用的...

    js冒泡排序 js冒泡排序

    js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序js冒泡排序...

    鼠标键盘事件及事件冒泡.pptx

    JavaScript+jQuery 网页特效设计;鼠标事件;1、鼠标事件;1、鼠标事件(案例);2、键盘事件;2、键盘事件(案例);3、事件的冒泡与阻止;3、事件的冒泡与阻止;3、事件的冒泡与阻止;3、事件的冒泡与阻止;3、事件的冒泡与...

    javascript 中事件冒泡和事件捕获机制的详解

    javascript 中事件冒泡和事件捕获机制的详解 二者作用:描述事件触发时序问题 事件捕获:从document到触发事件的那个节点,即自上而下的去触发事件—由外到内 事件冒泡:自下而上的去触发事件—由内到外 绑定事件...

    js阻止冒泡事件

    js阻止冒泡事件的方法有2种。 事件冒泡:当一个元素上的事件被触发时,同样的事件会在那个元素的所有祖先元素中被触发。 这个事件是从原始元素开始一直冒泡到DOM树最上层。 目标元素:任何一个事件的目标元素...

    【JavaScript源代码】javascript事件冒泡,事件捕获和事件委托详解.docx

    JavaScript中的事件处理是Web开发中的核心概念,主要涉及事件冒泡、事件捕获以及事件委托。这三种机制在处理用户交互和DOM元素之间的事件时起着至关重要的作用。 1. **事件冒泡**:事件冒泡是事件处理的默认模式,...

    js阻止冒泡及jquery阻止事件冒泡示例介绍.docx

    本文将详细介绍如何使用原生JavaScript (JS) 和 jQuery 来阻止事件冒泡,并通过实际示例加深理解。 #### 二、JS 阻止事件冒泡的方法 ##### 1. 原生JS阻止事件冒泡 在原生JS中,阻止事件冒泡可以通过以下两种方式...

    JS中绑定事件顺序(事件冒泡与事件捕获区别)

    JavaScript中的事件处理机制是网页交互的核心,其中包括了两种主要的事件传播模式:事件冒泡(Bubbling)和事件捕获(Cropping)。事件冒泡是指事件从最深的节点开始,然后逐级向上传播到最外层的节点。而事件捕获则...

    js冒泡的问题.docx

    JavaScript 事件冒泡是DOM(文档对象模型)中事件处理的一种机制,它涉及到事件如何从最深的节点向上传播到其父节点的过程。当在某个元素上触发一个事件,比如点击,该事件不仅会在该元素上执行,还会依次在所有父...

    js冒泡事件测试

    关于冒泡事件的demo,教你实现js的冒泡处理,适用于各种浏览器

    详解javascript事件冒泡

    事件冒泡是JavaScript中非常重要的一个概念,它描述了事件在DOM树结构中的传播方式。在事件冒泡过程中,一旦某个元素上的事件被触发,那么这个事件会从元素本身开始,沿着DOM树向上层元素传播,直到到达根节点。在此...

Global site tag (gtag.js) - Google Analytics