Make sure that mouseenter/mouseleave fire on the correct element when doing delegatio...

diff --git a/src/event.js b/src/event.js
index 05e79d3583761cda0f5d5da01463accb35051659..2bed09046c8f6d4d4e3ba6a68995a2224e03e237 100644 (file)
--- a/src/event.js
+++ b/src/event.js
@@ -654,6 +654,9 @@ var withinElement = function( event ) {
        // Check if mouse(over|out) are still within the same parent element
        var parent = event.relatedTarget;
 
+       // set the correct event type
+       event.type = event.data;
+
        // Firefox sometimes assigns relatedTarget a XUL element
        // which we cannot access the parentNode property of
        try {
@@ -663,15 +666,13 @@ var withinElement = function( event ) {
                if ( parent && parent !== document && !parent.parentNode ) {
                        return;
                }
+
                // Traverse up the tree
                while ( parent && parent !== this ) {
                        parent = parent.parentNode;
                }
 
                if ( parent !== this ) {
-                       // set the correct event type
-                       event.type = event.data;
-
                        // handle event if we actually just moused on to a non sub-element
                        jQuery.event.handle.apply( this, arguments );
                }

diff --git a/test/delegatetest.html b/test/delegatetest.html
index c4f33aaeab5aa6e56879fbbd653dfa0ffbada767..a5c6db17a83069119b159879c5a1e1afaabbf245 100644 (file)
--- a/test/delegatetest.html
+++ b/test/delegatetest.html
@@ -183,6 +183,16 @@
                <td id='boundSubmit' class="red">DOCUMENT</td>
        </tr>
         </table>
+       
+       <h1>Mouseleave Tests</h1>
+
+       <div class="out" style="margin:20px; border:1px solid #000; background: red;">
+       <p>Count mouse leave event</p>
+       <div class="in" style="background: green; margin: 10px auto; width: 50%;">
+               <p>mouse over here should not trigger the counter.</p>
+       </div>
+       <p>0</p>
+       </div>
 
        <ul id="log"></ul>
 
@@ -270,6 +280,10 @@
                jQuery("#boundSubmit").blink();
        });
 
+var n = 0;
+$("div.out").live("mouseleave", function() {
+    $("p:last", this).text(++n);
+});
         </script>
     </body>
 </html>