使用jQuery更改图像源
我的DOM看起来像这样：
<div id="d1">
<div class="c1">
<a href="#"><img src="img1_on.gif"></a>
<a href="#"><img src="img2_on.gif"></a>
</div>
</div>
当有人点击图片时，我希望图片的src更改为<img src="imgx_off.gif"> ，其中x代表图片编号1或2。
这是可能的还是我必须使用CSS来更改图像？
你可以使用jQuery的attr（）函数。 例如，如果您的img标签具有“my_image”的id属性：
<img id="my_image" src="first.jpg"/>
然后您可以通过以下方式更改jQuery中的src：
$("#my_image").attr("src","second.jpg");
要将其附加到click事件，您可以编写：
$('#my_image').on({
'click': function(){
$('#my_image').attr('src','second.jpg');
}
});
要旋转图像，你可以这样做：
$('img').on({
'click': function() {
var src = ($(this).attr('src') === 'img1_on.jpg')
? 'img2_on.jpg'
: 'img1_on.jpg';
$(this).attr('src', src);
}
});
人们在更改图像源时所做的一个常见错误是，不会等待图像加载，以执行后续操作，例如图像大小成熟等。您将需要使用jQuery .load()方法在图像加载后执行.load()操作。
$('yourimageselector').attr('src', 'newsrc').load(function(){
this.width; // Note: $(this).width() will not work for in memory images
});
编辑原因：https：//stackoverflow.com/a/670433/561545
了解更多信息。 我尝试使用以下语法在jquery中为$("#myid").attr('src', '/images/sample.gif'); image方法设置src属性： $("#myid").attr('src', '/images/sample.gif');
这个解决方案是有用的，它的工作原理，但如果改变路径的变化也影响和不工作的路径。
我寻找解决这个问题，但没有发现任何东西。
解决方法是将''放在路径的开头： $("#myid").attr('src', 'images/sample.gif');
这个技巧对我来说非常有用，我希望它对其他人有用。
链接地址: http://www.djcxy.com/p/78165.html