首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

HTML div标签内部组件导致onmouseout事件调用有关问题

2013-03-29 
HTML div标签内部组件导致onmouseout事件调用问题这几天一直纠结于一个html页面上的bug, 我们前台框架是IC

HTML div标签内部组件导致onmouseout事件调用问题
这几天一直纠结于一个html页面上的bug, 我们前台框架是ICEFaces3.1, 这些无所谓,翻译出来都是html标签
   问题表述: 情况是我的一个div里套了很多ul和li标签,我在这个外层的div里放了一个onmouseout鼠标事件,很简单的情况,然而在测试期间发现,当鼠标移动到这个div内部的任意元素上时,外层div的onmouseout事件竟然也被触发了,这个问题困扰了我已经有2天了,一直没有找到解决办法,昨天在网上搜了半天,发现其实有不少开源js框架里已经解决了这个问题。
   解决方案: 主要思想就是,将这个onmouseout事件触发的函数使用onmouseout调用并传入一个很短的时间,同时在这个div里加入一个onmouseover事件,在onmouseover时调用一个clearTimeout函数将它remove掉,即可解决。
   举例:


面对这种div内部元素也会触发外部onmouseout动作的情况,需要添加一个setTimeout和clearTimeout方法,相当于在内部触发onmouseout事件之前便将它clear掉:
var t;//在这里调用setTimeout方法让它在一段很短的时间后执行function doSomethingDiv(){   t = setTimeout('doSomeFunc()',400);}//将setTimeout事件remove掉function clearTime(){   clearTimeout(t);}


效果不错,是个很聪明的办法.

热点排行