Ie onmouseover与onmouseout解析问题

旧城等待， 2021-12-12 03:05 258阅读 0赞

![ContractedBlock.gif][] ![ExpandedBlockStart.gif][] Code   
<html>       
  
  <head>   
  
  <meta  http-equiv="Content-Type"  content="text/html;  charset=gb2312">   
  
  <title>ie onmouseover 与onmouseout解析问题</title>   
  
  </head>      
  
  <body>   
  
  <pre>      
  
  1.this:指代触发事件的对象   
  
  2.fromElement:event.fromElement   
  
  3.toElement:event.toElement   
  
     
  
  IE的做法似乎是：   
  
  如果  (fromElement!=toElement)  &&  (toElement  ∈  this)    就触发onmouseover事件一次   
  
  如果  (fromElement!=toElement)  &&  (fromElement  ∈  this)  就触发onmouseout事件一次   
  
     
  
  见下例，鼠标在下图区移动，注意五个input里值的变化。   
  
  </pre>      
  
  <div  id=span1  style="border:  10px  solid  red"     onmouseover="ieMouseOver.value=ieMouseOver.value\*1+1;if(!this.contains(event.fromElement))  ourMouseOver.value=ourMouseOver.value\*1+1;"     onmouseout="ieMouseOut.value=ieMouseOut.value\*1+1;if(!this.contains(event.toElement))  ourMouseOut.value=ourMouseOut.value\*1+1;"   
  
    onmousemove="ieMouseMove.value=ieMouseMove.value\*1+1;"   
  
    >span1   
  
    <div  style="background-color:  \#E0FFF0"  style="border:  10px  solid  blue;"  >  &nbsp;span2&nbsp;   
  
    <div  style="background-color:  \#E0FFF0"  style="border:  10px  solid  yellow"  >  &nbsp;span3&nbsp;   
  
    </div>   
  
    &nbsp;span2&nbsp;   
  
    </div>   
  
    &nbsp;span1&nbsp;   
  
    </div>        
  
    ie  mouseOver: <input  id=ieMouseOver> <br/>       
  
    ie  mouseOut: <input  id=ieMouseOut> <br/>       
  
    mouseMove: <input  id=ieMouseMove> <br/>       
  
    our  mouseOver: <input  id=ourMouseOver> <br/>       
  
    our  mouseOut: <input  id=ourMouseOut> <br/>   
  
  </body>      
  
  </html>

转载于:https://www.cnblogs.com/TSPWater/archive/2009/05/27/1490800.html

[ContractedBlock.gif]: https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif
[ExpandedBlockStart.gif]: /images/20211211/7a8f1fe477674c2893c8c0ab4f4b4f58.png