Javascript jQuery实时悬停

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

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

$（“li.favorite\u项目”）。悬停(
函数（）{
$（this.append（$（“”））；
}, 
函数（）{
$（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();
    }
});

$（“li.favorite_item”）.live（'hover'，function（）{
函数（）{
$（this.append（$（“”））；
}, 
函数（）{
$（this.find（“a:last”）.remove（）；
}
});

但是它不起作用。

来自jQuery 1.7+。live（）是，而.delegate（）是通过.on（）方法

使用and代替.live（），并使用.die（）。使用.on（）代替.delegate（）

转换旧代码很简单

---

您需要单独调用映射到的事件，如下所示：

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

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

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

此外，如果这是在特定的

上，则是更好的选择，如下所示：

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

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

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

$（“#myUL”）.delegate（“li.favorite_项目”{
mouseenter:function（）{
$（this.append（$（“”））；
},
mouseleave:function（）{
$（this.find（“a:last”）.remove（）；
}
});

虽然.live（）语法更好，但我们现在必须使用.on（）

您可以在文档上使用事件映射，选择器作为第二个参数：

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

$（文档）。在({
鼠标指针：函数（）{
$（此）。追加（“”）；
},
mouseleave:function（）{
$（this.find（“a:last”）.remove（）；
}
}，“li.最喜欢的项目”）；

这是真的…

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