Without jQuery, ng-mouseleave behaves like mouseout, not mouseleave #1811
Comments
|
As noted in the demo, neither the plunk or jQuery versions fully support select elements inside bound element. Some events in the opened select list are outside bound element, triggering it. |
|
I just ran into this issue and had created a plnkr too. I'm experiencing the same problem. Here is the plankr, open your console to see the log of what is happening: |
|
This should get fixed, but in the mean time, I just posted an Angular-native workaround directive, here: The current Angular directive is one of a set of directives that just wrap the browser event, which isn't as useful. I've got a fork incorporating this change, but I'm unsure how to test it, or if it's how the team would do it. |
|
In my case jquery does the trick. I'll look into your solution if it breaks at some point. Thanks BTW, using the ng- prefix isn't a good idea as it is reserved for the Angular core team. That way we now what is really native and what is not. |
|
I'm not using jQuery with Angular, so far, hoping not to, so an Angular-native solution works better for me. Thanks for poking me about the repo name, duh. I'm aware it's "proprietary". I set the repo up really quickly from existing code, which doesn't use the ng prefix, just spaced it. |
Implement mouseenter/mouseleave event refering to http://www.quirksmode.org/js/events_mouse.html#link8 and jQuery source code(not dependent on jQuery). The old implementation is wrong. When moving mouse from a parent element into a child element, it would trigger mouseleave event, which should not. And the old test about mouseenter/mouseleave is wrong too. It just triggers mouseover and mouseout events, cannot describe the process of mouse moving from one element to another element, which is important for mouseenter/mouseleave. Closes angular#2131, angular#1811
Implement mouseenter/mouseleave event referring to http://www.quirksmode.org/js/events_mouse.html#link8 and jQuery source code(not dependent on jQuery). The old implementation is wrong. When moving mouse from a parent element into a child element, it would trigger mouseleave event, which should not. And the old test about mouseenter/mouseleave is wrong too. It just triggers mouseover and mouseout events, cannot describe the process of mouse moving from one element to another element, which is important for mouseenter/mouseleave. Closes #2131, #1811
Implement mouseenter/mouseleave event referring to http://www.quirksmode.org/js/events_mouse.html#link8 and jQuery source code(not dependent on jQuery). The old implementation is wrong. When moving mouse from a parent element into a child element, it would trigger mouseleave event, which should not. And the old test about mouseenter/mouseleave is wrong too. It just triggers mouseover and mouseout events, cannot describe the process of mouse moving from one element to another element, which is important for mouseenter/mouseleave. Closes #2131, #1811
|
As part of our effort to clean out old issues, this issue is being automatically closed since it has been inactivite for over two months. Please try the newest versions of Angular ( Thanks! |
The difference between mouseleave and mouseout is that mouseout is triggered by mousing over child elements inside the bound element, while mouseleave is not, in general making it much more useful. Unless jQuery is used, ng-mouseleave acts like mouseout, not mouseleave, which I think is a bug.
There's a full demo here: http://plnkr.co/edit/TEO20k32uLe3r5Nui09F?p=preview
It shows the default behavior, and by un-commenting the included jQuery CDN script tag, you can see how it should behave.
A possible fix is to bind to the native mouseout event, and check whether the mouse is still inside the bound element in code. A demo of that strategy is here: http://plnkr.co/edit/VpdlEygKxrDmPpNyk64M?p=preview
The text was updated successfully, but these errors were encountered: