.delegate эквивалент существующего метода .hover в jQuery 1.4.2 - PullRequest
Новая
       13

.delegate эквивалент существующего метода .hover в jQuery 1.4.2

1 голос
/ 07 апреля 2010

У меня есть обработчик события, связанный с событием hover с использованием метода .hover, который приведен ниже: 

$(".nav li").hover(function () {
    $(this).addClass("hover");
}, function () {
    $(this).removeClass("hover");
});

Важно отметить, что мне требуются обе функции в обработчике для обеспечения синхронизации.Можно ли переписать функцию, используя .delegate, так как следующее не работает? 

$(".nav").delegate("li", "hover", function () {
    $(this).addClass("hover");
}, function () {
    $(this).removeClass("hover");
});

Rich

Ответы [ 2 ]

2 голосов
/ 07 апреля 2010

Попробуйте этот подход: 

$(".nav").delegate("li", "hover", function () {
    $(this).toggleClass("hover");
});

Это зависит от того, не будет ли .nav заменен через AJAX или иным образом, поскольку именно там находится обработчик событий.Если он заменяется, вы должны прикрепить делегата к более высокому предку, который не заменяется.

Также незначительное исправление, $(".nav li").hover(function () { не использует метод .live(), это будет: $(".nav li").live('hover', function () {..hover() привязывает событие непосредственно к элементу, когда этот код выполняется ... любые будущие элементы не будут вызывать этот код при наведении, вот где .live() и .delegate() отличаются, они работают с будущими элементами через всплывающее окно.

1 голос
/ 17 октября 2011

Чтобы добавить / удалить класс, решение Ника идеально подходит, поскольку jQuery предоставляет соответствующий метод toggleClass.

Если вам нужно активировать более сложные функции, для которых нет соответствующего метода переключения, вы можете сделать это, протестировав тип события: 

$(".nav").delegate("li", "hover", function (event) {
if(event.type == "mouseenter"){
    $(this).find(".subDiv").slideDown();
}else{
    $(this).find(".subDiv").slideUp();
}
});

Это будет работать для jQuery> = 1.4.3 - для более старых версий используйте mouseover вместо mouseenter .

...