JQuery живой парящий

Question

Я не могу преобразовать следующее в живое наведение

$("li.favorite_item").hover(
    function () {
        $(this).append($(" <a href='#' class='button'>x</a>"));
    }, 
    function () {
        $(this).find("a:last").remove();
    }
);

Я пробовал:

$("li.favorite_item"").live('hover', function() { 
    function () {
        $(this).append($(" <a href='#' class='button'>x</a>"));
    }, 
    function () {
        $(this).find("a:last").remove();
    }
});

Но это не работает.

Answer 1

Из jQuery 1.7+ .live () равен устарел , а .delegate () был заменен .on() метод.

Используйте .on () и .off () вместо .live () и .die ().Используйте .on () вместо .delegate ().

Преобразование старого кода является простым , как описано здесь .

---

Вам нужно вызывать события, которые.hover() отображается отдельно, как это:

$("li.favorite_item").live('mouseenter', function() { 
  $(this).append($(" <a href='#' class='button'>x</a>"));
}).live('mouseleave', function () {
  $(this).find("a:last").remove();
});

.hover() не является функцией события, как .click()Например, это просто специальный ярлык для .mouseenter(handler1).mouseleave(handler2) ... так что вам нужно сделать то же самое при вызове .live().

Если выНа jQuery 1.4.3+ вы можете использовать карту для упрощения вещей, например:

$("li.favorite_item").live({
  mouseenter: function() { 
    $(this).append($(" <a href='#' class='button'>x</a>"));
  },
  mouseleave: function () {
    $(this).find("a:last").remove();
  }
});

Кроме того, если это определенное значение <ul>, .delegate() это лучший вариант, например:

$("#myUL").delegate("li.favorite_item", {
  mouseenter: function() { 
    $(this).append($(" <a href='#' class='button'>x</a>"));
  },
  mouseleave: function () {
    $(this).find("a:last").remove();
  }
});

Answer 2

Синтаксис .live () был приятнее, но теперь мы должны использовать .on ().

В документе можно использовать карту событий с селектором в качестве второго аргумента:

$(document).on({
    mouseenter: function () {
        $(this).append("<a href='#' class='button'>x</a>");
    },
    mouseleave: function () {
        $(this).find("a:last").remove();
    }
}, "li.favourite_item");

Answer 3

это правда ...

$("#your_div_id").live('mouseover',function(){

    $(this).find(".child_div").css('background-color','#111111');

}).live('mouseout',function(){

     $(this).find(".child_div").css('background-color','#757575');
});