javascript – jQuery live hover

我似乎无法将以下内容转换为实时悬停

$("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();
    }
});

但它不起作用.

.

使用 .on() 和 .off() 代替.live()和.die().使用.on()代替.delegate().

转换旧代码很简单 as explained here .

您需要分别调用 .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() 这样的事件函数,例如,它是 just a special shortcut for .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();
  }
});