jquery가있는 hover.jpg로 이미지를 변경하는 방법

Question

다음 출력이 있습니다.

<ul id='centrelist'> 
<li class="centreicon"><a href="admin/manage_mycentre/22"><img width='70' height='70' class='centreimg' src="http://localhost/aktivfitness_new/assets/images/centre/centre1.jpg" /></a><div class="buttons"><a href="admin/manage_mycentre/22">Aktiv trening Arendal</a></div></a></li> 
<li class="centreicon"><a href="admin/manage_mycentre/16"><img width='70' height='70' class='centreimg' src="http://localhost/aktivfitness_new/assets/images/centre/centre2.jpg" /></a><div class="buttons"><a href="admin/manage_mycentre/16">Aktiv trening Blindheim</a></div></a></li> 
<li class="centreicon"><a href="admin/manage_mycentre/17"><img width='70' height='70' class='centreimg' src="http://localhost/aktivfitness_new/assets/images/centre/centre3.jpg" /></a><div class="buttons"><a href="admin/manage_mycentre/17">Aktiv trening Eid</a></div></a></li> 
... 

이제 이미지를 가리키면 jover로 hover.jpg로 변경하고 싶습니다.

다음과 같지만 제대로 작동하지 않습니다.

$(function() { 
    $(".centreimg") 
     var orgimg = $(this).attr("src"); 
     .mouseover(function() { 
      var hoverimg = $(this).attr("src").match(/[^\.]+/) + "hover.jpg"; 
      $(this).attr("src", hoverimg); 
     }) 
     .mouseout(function() { 
      $(this).attr("src", orgimg); 
     }); 
}); 

누군가가 나를 도울 수 있기를 바랍니다.

미리 감사드립니다.

$(function() { 
    $(".centreimg").mouseover(function() { 
      var hoverimg = $(this).attr("src").match(/[^\.]+/) + "hover.jpg"; 
      var orgimg = $(this).attr("src"); 

      $(this).attr("src", hoverimg); 
      $(this).attr("title", orgimg); 
     }) 
     .mouseout(function() { 
      $(this).attr("src", $(this).attr("title")); 
     }); 
}); 

당신은 data() 방법을 사용하여 객체 내에

Answer 1

는, 그것은 간단합니다.

$('.centreimg').hover( 
function() { 
    $(this).data('src',$(this).attr('src')); 
    $(this).attr('src', 'hover.jpg'); //or hoverimg if it is declared 
}, 
function(){ 
    $(this).attr('src', $(this).data('src')); 
}); 

Answer 2

jQuery를 코드 데이터를 저장해야 할 단지 약간의 보정