zoukankan      html  css  js  c++  java

  • mouseover事件与mouseenter事件的区别

    不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。对应mouseout
    只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。对应mouseleave

    这样的话，mouseenter子元素不会反复触发事件，否则在IE中经常有闪烁情况发生。

     
      1. <html>  
      2. <head>  
      3. <script type="text/javascript" src="/jquery/jquery.js"></script>  
      4. <script type="text/javascript">  
      5. x=0;  
      6. y=0;  
      7. $(document).ready(function(){  
      8.   $("div.over").mouseover(function(){  
      9.     $(".over span").text(x+=1);  
      10.   });  
      11.   $("div.enter").mouseenter(function(){  
      12.     $(".enter span").text(y+=1);  
      13.   });  
      14. });  
      15. </script>  
      16. </head>  
      17. <body>  
      18. <p>不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。</p>  
      19. <p>只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。</p>  
      20. <div class="over" style="background-color:lightgray;padding:20px;40%;float:left">  
      21. <h2 style="background-color:white;">被触发的 Mouseover 事件：<span></span></h2>  
      22. </div>  
      23. <div class="enter" style="background-color:lightgray;padding:20px;40%;float:right">  
      24. <h2 style="background-color:white;">被触发的 Mouseenter 事件：<span></span></h2>  
      25. </div>  
      26. </body>  
      27. </html>  
  • 相关阅读:
    nodejs难点
    react 组件化
    vue router & vuex
    vue源码思考
    cookie & session
    servlet
    Hashmap
    Zookeeper+Kafka+flink+socket
    flink consumer can realize kafka avro with overwriting kafkaDeseriler, and executor multithread and genretic extends
    flink kafka consumer with avro schema. handling null
  • 原文地址：https://www.cnblogs.com/dunken/p/4364940.html
Copyright © 2011-2022 走看看