当一个容器,如div,不包含元素时。Onmouseover只执行一次,正常。当这个div包含其他子元素的时候,这个事件就被执行了多次,今天遇到了这个问题,特此记录下,解决方案。

这个是由于onmouseover引起的,主要是因为ul里面包含了子元素,会造出鼠标移动到子元素,比如li上面也会触发ul的onmouseover事件,造成了混乱。解决办法:

,如果是IE浏览器,用onmouseleave代替。

,不管什么浏览器,下面这个方法都是牛逼的,不信,你试试。

  1.  stateList.onmouseout = function(e){    
  2.   if( !e ) e = window.event;    
  3.   var reltg = e.relatedTarget ? e.relatedTarget : e.toElement;    
  4.   while( reltg && reltg != this ) reltg = reltg.parentNode;    
  5.   if( reltg != this ){    
  6.       // è¿™é‡Œå¯ä»¥ç¼–写 onmouseleave äº‹ä»¶çš"å¤"理代码    
  7.     stateList.style.display='none';  
  8.  }  
  9. }  

原文在这里:http://blog.csdn.net/teresa502/article/details/6103458

Onmouseover被调用多次的更多相关文章

  1. JS事件 鼠标经过事件(onmouseover)鼠标经过事件,当鼠标移到一个对象上时,该对象就触发onmouseover事件,并执行onmouseover事件调用的程序。

    鼠标经过事件(onmouseover) 鼠标经过事件,当鼠标移到一个对象上时,该对象就触发onmouseover事件,并执行onmouseover事件调用的程序. 现实鼠标经过"确定&quo ...

  2. JS事件-让网页交互

    什么是事件 JavaScript 创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件. 比如说,当用户单击 ...

  3. JavaScript进阶知识点(慕课)

    JavaScript能做什么? 1.增强页面动态效果(如:下拉菜单.图片轮播.信息滚动等) 2.实现页面与用户之间的实时.动态交互(如:用户注册.登陆验证等)  一. 数组 var myarray=n ...

  4. 二、JavaScript语言--JS基础--JavaScript进阶篇--事件响应

    1.什么是事件 JavaScript 创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件. 比如说,当用户 ...

  5. 5、JavaScript进阶篇②——函数、事件、内置对象

    一.函数 1. 什么是函数 函数的作用,可以写一次代码,然后反复地重用这个代码. 如:我们要完成多组数和的功能. var sum; sum = 3+2; alert(sum); sum=7+8 ; a ...

  6. HTML第七天学习笔记

    今天主要是学习如何使用JS,第一个就是先是使用JS输出"Hello world" <!doctype html> <html lang="en" ...

  7. Unity3D脚本中文系列教程(十)

    http://dong2008hong.blog.163.com/blog/static/4696882720140312627682/?suggestedreading&wumii Unit ...

  8. Javascript进阶篇——( 事件响应)笔记整理

    什么是事件 JavaScript 创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件. 鼠标单击事件(on ...

  9. JS子元素oumouseover触发父元素onmouseout

    原文:JS子元素oumouseover触发父元素onmouseout JavaScript中,父元素包含子元素: 当父级设置onmouseover及onmouseout时,鼠标从父级移入子级,则触发父 ...

随机推荐

  1. 《The Book of CSS3》学习笔记

    一.浏览器前缀 E{ -moz-name : value; /* Firefox */ -ms-name : value; /* IE */ -o-name : value; /* Opera */ ...

  2. linux下svn定时更新项目

    方法一.用shell脚本定时更新项目   1.进入网站的根目录,假设项目位置放在/var/www/test cd /var/www/test   2.建立脚本文件update.sh,分两步进行.首先利 ...

  3. C++ Primer学习笔记二

    vector<int> a(10,0); for(vector<int>::iterator itor=a.begin();itor!=a.end();itor++) *ito ...

  4. Shell 判断

    1  shell 的$! ,$?, $$,$@ $n        $1 the first parameter,$2 the second... $#        The number of co ...

  5. C++ 面向对象编程

    <C++ Primer 4th>读书笔记 面向对象编程基于三个基本概念:数据抽象.继承和动态绑定.在 C++ 中,用类进行数据抽象,用类派生从一个类继承另一个:派生类继承基类的成员.动态绑 ...

  6. Spring - 初始化spring容器

    2016.01.12 学习linux内核的过程中发现变相的提升了自己的工程能力.以前觉得spring这些东西很复杂麻烦.然而,学了linux内核再看这些东西,发现好简单. 学习spring首先就要学习 ...

  7. phpcms v9二次开发笔记

    phpcms是基于MVC结构的. 安装: 下载phpcms_v9.5.9_UTF8.zip:新建目录phpcms,将压缩包里install_package目录下所有文件复制到phpcms目录.浏览器输 ...

  8. Windows下安装Ruby

    Ruby是一门用了就会喜欢的语言,在Ruby的社区里面,只要你觉得用的不习惯,这就是BUG. 下载 登录官方网址, 下载后,直接无脑下一步安装就行. 中间直接勾选add to PATH,可以自动添加到 ...

  9. Java集合——题目

    第一题 (Map)利用Map,完成下面的功能: 从命令行读入一个字符串,表示一个年份,输出该年的世界杯冠军是哪支球队.如果该 年没有举办世界杯,则输出:没有举办世界杯. 附:世界杯冠军以及对应的夺冠年 ...

  10. Exception in thread "main" java.lang.UnsupportedClassVersionError: org/apache/ma ven/cli/Maven/java与javac版本不一致问题

    编译的时候 中出现如下异常: Exception in thread "main" Java.lang.UnsupportedClassVersionError: org/apac ...