views:

2110

answers:

1

I'm trying some event bindings with jQuery and I have this simple code in my document ready:

$(document).ready(function() {
  $("p a").each(function(i, selected){
    $(selected).hover( 
      function(event) { alert('over: ' + event.type); }, 
      function(event) { alert('out: ' + event.type); });
    }
  )
});

So, when I move mouse over a link thats inside a paragraph (selector is "p a") alerts pop-up twice. So, mouseenter and mouseleave are fired twice.

Can someone explain, why is this happening?

Thanks :)

EDIT: This only happens in Google Chrome. In IE7/FF3/Opera both events are fired only once.

+4  A: 

I think somehow the alert is actually causing the extra events in Chrome. With the following code I only see one event.

$(document).ready(function() {
  $("p a").each(function(i, selected){
    $(selected).hover( 
      function(event) { $("p").append('<br>over: ' + event.type); }, 
      function(event) { $("p").append(' out: ' + event.type); });
    }
  )
});
Sam Hasler
Yup - as soon as the alert is shown, another mouseover event is triggered.
Shog9
Thanks for your answer. I've checked Safari - there the alert "kills" the mouseleave event...
emirc