el evento mouseout ocurrir más de una vez

StackOverflow https://stackoverflow.com/questions/4069558

  •  28-09-2019
  •  | 
  •  

Pregunta

Hola: cuando agrego un evento mouseout a un elemento padre, parece que la totalidad de su hijo se añaden este caso también, funciona bien si el evento es un clic del ratón y etc.

Sin embargo para el evento mouseout, esto hará que algún resultado inesperado.

Tome un vistazo a este ejemplo: 

<html>
    <head>
        <script type="text/javascript">
            function init(){
                document.getElementById('par').onmouseout=function(){alert('mouse out')};
            }
    </script>
    </head>
    <body onload='init()'>
        <div id="par" style="width:400px;height:300px">
            <div style="background-color:red;width:100%;height:150px"></div>
            <div style="background-color:black;width:100%;height:150px"></div>
        </div>
    </body>
</html>

Por favor, mueva desde el rojo al div div negro, a continuación, se mueve fuera de la div negro, por lo que recibirá dos ventana de alerta, sólo quiero uno.

Entonces, ¿cómo solucionarlo?

¿Fue útil?

Solución

Eso no es posible el uso de JavaScript simple, sin la mouseLeave evento, que, que yo sepa, sólo es compatible con Internet Explorer.

kits de herramientas de Javascript puede proporcionar una solución, jQuery por ejemplo emula este caso:

  

Los eventos difiere de mouseleave   mouseout en la forma en que maneja evento   burbujeante. Si se utilizara en mouseout   este ejemplo, a continuación, cuando el ratón   puntero se trasladó fuera de la Interior   elemento, el manejador sería   desencadenado. Esto es generalmente indeseable   comportamiento. El evento mouseleave, en   Por otro lado, sólo se activa su   manejador cuando el ratón sale de la   elemento que está obligado a, no una   descendiente. Así que en este ejemplo, el   manejador se activa cuando el ratón   hojas en el Outer elemento, pero no la   Interior elemento .

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top