jquery mouseout和mouseleave区别

mouseout()和mouseleave()

都是鼠标移出元素时触发，但是这两者又有所区别，需要大家留意：

• 不论鼠标指针离开指定元素还是该元素子元素，都会触发 mouseout 事件。

• 只有在鼠标指针离开指定元素时，才会触发 mouseleave 事件。

举个例子来说：

现在有两个div，第一个<div>初始红色并且有个子元素<a>，第二个<div>初始为绿色

 <div id="1"style="width: 200px;height: 200px;background-color: red;margin-bottom: 10px;">

     <a>hehe</a>

 </div>

 <div id="2"style="width: 200px;height: 200px;background-color: green;margin-bottom: 10px;"></div>

现在我们分别用mouseout和mouseleave测试

  $(document).ready(function()

 {

     $("#1").mouseout(function()//此方式下，当鼠标移出<a>元素也会触发

     {

         $("#2").css("background-color","yellow");

     });

 });  

 $(document).ready(function()

 {

     $("#1").mouseout(function()//只有鼠标移出#1<div>时才会触发

     {

         $("#2").css("background-color","blue");

     });

 });

　　今天在做放大镜效果时，出现了光标的div跳动的情况，查资料并记录。