Cannot use .bind () to bind hover

Question

I am experimenting with jQuery. As I tried, I found out that I cannot use the hover event with .bind. And I do not know what is wrong.

$(document).ready(function(){ $('.some-class').bind({ hover: function(e) { // Hover event handler alert("hover"); }, click: function(e) { // Click event handler alert("click"); }, blur: function(e) { // Blur event handler } }); }); 

What is surprising (at least for me) is that guidance does not work. The rest of the "click" and "blur" work fine.

You can also work without problems.

 $(".some-class").hover(function(){ // stuff }) 

Maybe I can use the code above. But not knowing why this is a big nuisance. So any ideas?

Thank!

Answer 1

You need to use the mouseenter and mouseleave (which .hover() uses) directly when binding to such an object

 $(document).ready(function(){ $('.some-class').bind({ mouseenter: function(e) { // Hover event handler alert("hover"); }, mouseleave: function(e) { // Hover event handler alert("hover"); }, click: function(e) { // Click event handler alert("click"); }, blur: function(e) { // Blur event handler } }); }); 

.hover() specifically defined here in the jQuery event code ... it just isn't supported like other events in places like .bind() , since it is not an event, it's just to help you bind the mouseenter and mouseleave .

Answer 2

Not so much, but it's just not in the specification. Verify that doc-hover is not listed in the related events.

http://api.jquery.com/bind/