jquery悬停函数在显示img后不工作

我的代码如下： 第一个函数使用rel atribute在鼠标上显示另一个图像 第二个函数获取一个隐藏的div，并在同一页面上的另一个位置显示内容，但当我将图像悬停时，图像不会改变，悬停在隐藏的div上会起作用，但在移动它并单击其他位置后，悬停不起作用。我想它可能是文档就绪脚本，因为我在就绪后更改了页面，但我不确定，有什么建议吗？多谢各位

$(document).ready(function(){
$(function() {
    $('img[rel]').hover(function() {
        $(this).attr('tmp', $(this).attr('src')).attr('src', $(this).attr('rel')).attr('rel', $(this).attr('tmp')).removeAttr('tmp');
    }).each(function() {
        $('<img />').attr('src', $(this).attr('rel'));
    });;
});

$(function(){
    $('.id2').one("click",function() {
         var newPara = $('#test').html();
        $('#big_photo').append(newPara);
    }); 
});

$（文档）.ready（函数（）{
$（函数（）{
$（'img[rel]'）。悬停（函数（）{
$（this.attr（'tmp'，$（this.attr（'src'））.attr（'src'，$（this.attr（'rel'））.attr（'rel'，$（this.attr（'tmp'））.removeAttr（'tmp'）；
}).each（函数（{
$('
我认为你应该考虑使用图像切换，因为在我看来，这是一个更优雅的解决方案。


您不需要rel属性（它不是有效的img属性）
（无论如何）
加载第二个图像没有问题，因为它是
一次装完

也

及

是相同的，您只需要其中一个，因此：

$(function() {
   // all your jQuery code
});

就够了


好的，那么对于交换src和rel-on-hover/out，应该可以：

$('img[rel]').bind('mouseenter mouseleave',function() {
    var oldSrc = $(this).attr('src');
    $(this).attr('src', $(this).attr('rel')).attr('rel', oldSrc);
});

演示：
我在动态图像库中使用它，但无法使用精灵。精灵的想法很好，我会将其应用到其他方面。谢谢
$(function() {
   // all your jQuery code
});

$('img[rel]').bind('mouseenter mouseleave',function() {
    var oldSrc = $(this).attr('src');
    $(this).attr('src', $(this).attr('rel')).attr('rel', oldSrc);
});