如何通过jquery更改src的值？

Question

HTML结构：

<div class="myimages"> 
    <div id="mainimg"><img src="images/Pic/1.jpg"></div> 
    <div id="addimg"> 
     <li class="addimg"><img src="images/Pic/1_01.jpg"></li> 
     <li class="addimg"><img src="images/Pic/1_02.jpg"></li> 
     <li class="addimg"><img src="images/Pic/1_03.jpg"></li> 

    </div> 
</div> 

如何改变IMG SRC的值（这在<div id="mainimg">）当在利鼠标悬停在其通过addimg jquery.namely，当在第二立鼠标悬停，<div id="mainimg"><img src="images/Pic/1.jpg"></div>将更改为<div id="mainimg"><img src="images/Pic/1_02.jpg"></div>。当在第一或第三里。变化是一样的。谢谢

Answer 1

像这样的东西应该工作：

$('li.addimg').hover(function() { 
    var src = $(this).find('img').attr('src'); 
    $('#mainimg img').attr('src', src); 
}); 

我们正在捕获这些li上的悬停事件，然后抓住悬停触发的li内部img的src，并将其设置为id内div的img的新src “mainimg”

Answer 2

应该是这样的：

jQuery('li.addimg').onmouseover(function() { 
    jQuery('#mainimg img').attr('src', jQuery(this).children('img').attr('src')); 
} 

Answer 3

假设你不想当您移动鼠标关闭li图像改回1.jpg，您可以将事件处理程序绑定到mouseover事件并使用replaceWith与一个在li更换图像：

$("li.addimg").mouseover(function() { 
    $("#mainimg img").replaceWith($(this).find("img")); 
}); 

Answer 4

试试这个：

$('.addimg').mouseover(function() { 
    $('.mainimg img').attr('src', $(this).find('img').attr('src')); 
}); 

Answer 5

就可以实现它AAS遵循

$(".adding").hover(function() { 
     var hoverImg = HoverImgOf($(this).attr("src")); 
     $("#mainimg img").attr("src", hoverImg); 
    } 

Answer 6

尝试：

http://jsbin.com/ifofot/edit#javascript,html

$('#addimg li.addimg img').on('mouseover',function(){ 
$(this).parents(".myimages").find("#mainimg img").attr('src',$(this).attr('src')); 


});