2013-03-01 3 views
0

Это то, что у меня есть:используя() с висения - JQuery

$('#blah').hover(function(){ 
    $('etc').show(); 
}, function(){ 
    $('etc').hide(); 
}); 

Это работает просто отлично, теперь я хочу точно выше код работает в прямом эфире с по методу():

$('#blah').on('hover', function(){ 
    $('#etc').show(); 
}, function(){ 
    $('#etc').hide(); 
}); 

Но это не работает, никто не знает почему? но это работает:

$('#blah').on('hover', function(){ 
    $('#etc').show(); 
}); 

Когда я использую на метод(), функция обратного вызова не работает, поэтому я использую MouseOver() и MouseLeave() с на(), и это работает, я просто хотел бы знать, почему парения обратного вызова не работает с на(), что так проще, чем использование 2 события ....

Благодаря

ответ

2

Из JQuery исходного кода, hover не входит в список событий, которые срабатывающие приводит к JQuery .on()

jQuery.each(("blur focus focusin focusout load resize scroll unload click dblclick " + 
    "mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave " + 
    "change select submit keydown keypress keyup error contextmenu").split(" "), function(i, name) { 

    // Handle event binding 
    jQuery.fn[ name ] = function(data, fn) { 
     return arguments.length > 0 ? 
      this.on(name, null, data, fn) : 
      this.trigger(name); 
    }; 
}); 

Это происходит потому, что .hover() это просто ярлык для JQuery .mouseenter() и .mouseleave()

jQuery.fn.hover = function(fnOver, fnOut) { 
    return this.mouseenter(fnOver).mouseleave(fnOut || fnOver); 
}; 

Надеюсь, что это краткое объяснение дает мало указаний.

0

используйте

jQuery.on("hover","#blah", function..) 

Или вы можете использовать тумблер особенность jQuery тоже

+3

В чем разница? вы передаете ему контекст. –

+0

не работает .... – behz4d

0

Да это не будет работать, потому что, когда вы используете .on() с hover то hover событие просто одну функцию обратного вызова вместо этого вы можете использовать несколько событий в .on()

Попробуйте

$("DOM").on({ 
    mouseenter: function() { 
     // Handle mouseenter... 
    }, 
    mouseleave: function() { 
     // Handle mouseleave... 
    } 
}); 
1

Используйте MouseEnter и MouseLeave для зависания. Проверьте с помощью наведения на here.

$("#blah").on(
{ 
    mouseenter: function() 
    { 
     //stuff to do on mouseover 
    }, 
    mouseleave: function() 
    { 
     //stuff to do on mouseleave 
    } 
}); 

Используйте переключатель, чтобы показать/скрыть,

$('#blah').on('hover', function(){ 
    $('#etc').toggle(); 
}); 
+0

не имеет значения, я уже нашел решение проблемы, я просто хотел знать, почему он не работает, но хороший момент, спасибо – behz4d

+0

@ behz4d, он не работал, потому что когда вы используете зависание, используя у меня есть только один звонок назад, см. мой ответ .. –

1

Это потому, что hover это на самом деле не событие браузера, на самом деле его просто сокращение для вызова

$(selector).mouseenter(handlerIn).mouseleave(handlerOut); 

Использование с .on('hover') форма have been deprecated с версии 1.8.

0

Используйте переключатель()

$('#blah').on('hover', function(){ 
    $('#etc').toggle(); 
}); 
3

из Jquery документации. Jquery on

Устаревшие от JQuery 1.8: Название "парить" используется как сокращение для строка "MouseEnter MouseLeave". Он прикрепляет обработчик одного события для этих двух событий, и обработчик должен проверять event.type на , определяют, является ли событие mouseenter или mouseleave. Не следует путать псевдо-событие-имя «hover» с методом .hover(), который принимает одну или две функции.

$("div.test").on({ 
    mouseenter: function(){ 
    $(this).addClass("inside"); 
    }, 
    mouseleave: function(){ 
    $(this).removeClass("inside"); 
    } 
}); 
Смежные вопросы