Jquery，添加&悬停时删除元素

Question

我遇到了一个问题，我尝试了几乎所有方法都没有解决。

$('a.hovered').hover(function () {
    $(this).after(' <img src="images/icons/famfamfam/silk/user_go.png" />');
},function () {
    $(this).remove(' <img src="images/icons/famfamfam/silk/user_go.png" />');
});

当然，我尝试了这个remove()的许多版本，但没有成功。如果有人能帮助我解决这个问题，我会很高兴。

另外，我想添加 fadeIn() 和 fadeOut() 的效果，但当然这也没有成功。

我可以添加图像，但无法删除它（即使是 fadeIn 也不起作用，而我可以成功添加图像）。

感谢您提前提供的帮助和时间。

Answer 1

你真的不想这样做。如果您只显示和隐藏始终存在的图像，您的代码将更快、更清晰且更易于维护。

只需将 img 放入您的 html 中并设置 id 和 style="display: none;" 即可隐藏它。

然后你的 JavaScript 代码就变成了：

$('a.hovered').hover(function () {
    $("#user_go").show();
},function () {
    $("#user_go").hide();
});

Answer 2

为您的元素命名，这会让您的生活更轻松，即：

$('a.hovered').hover(function () {
    $(this).after(' <img id="user_go" src="images/icons/famfamfam/silk/user_go.png" />');
},function () {
    $("#user_go").remove();
});

Answer 3

你不能以这种方式引用创建的对象，尝试一下，

$('a.hovered').hover(function () {
    $(this).after(' <img src="images/icons/famfamfam/silk/user_go.png" id="addedImage"/>');},
    $('#addedImage').remove();
});

是的，当我写的时候，另外两个人发布了相同的东西:)

Answer 4

.remove() 不使用 HTML 片段：

$('a.hovered').hover(function () {
    $(this).after(' <img src="images/icons/famfamfam/silk/user_go.png" id="go_image" />');
},function () {
    $('#go_image').remove();
});

Answer 5

为什么不这样做呢？

$('a.hovered').hover(function () {      
$(this).after(' <img src="images/icons/famfamfam/silk/user_go.png" />');  },
function () {
$(this).find('img').remove();
 });