如何通过jquery更改src的值? [英] How to change the src's value by jquery?

问题描述

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>

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

How to change the img src's value(which in <div id="mainimg"> ) when the mouse hover on the li which in addimg by jquery.namely, when the mouse hover on the second li, <div id="mainimg"><img src="images/Pic/1.jpg"></div> will change to <div id="mainimg"><img src="images/Pic/1_02.jpg"></div>. when on the first or the third li. the change is the same. thank you

推荐答案

类似的方法应该起作用:

Something like this should work:

$('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.

We are catching the hover event on those li's and then grabbing the src of the img inside of the li that the hover is triggered on, and setting it as the new src of the img inside of the div with id "mainimg"

这篇关于如何通过jquery更改src的值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！