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>

当鼠标悬停在<div id="mainimg">上时，当鼠标悬停在第二个li上时，如何更改img src的值（在addimg中）当<div id="mainimg"><img src="images/Pic/1.jpg"></div>悬停在<div id="mainimg"><img src="images/Pic/1_02.jpg"></div>上{{1} }将更改为{{1}}。当第一或第三李。变化是一样的。谢谢

Answer 1

这样的事情应该有效：

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

我们正在抓住那些li的悬停事件，然后抓住触发悬停的li里面的img的src，并将其设置为id为“mainimg”的div里面的img的新src

Answer 2

试试这个：

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

Answer 3

你可以按照

来实现它

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

Answer 4

它应该是这样的：

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

Answer 5

当您将鼠标移离1.jpg时，假设您不希望图像更改回li，您可以将事件处理程序绑定到mouseover事件并使用{ {3}}将图片替换为li中的图片：

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

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'));


});

如何通过jquery更改src的值？

6 个答案: