使用jQuery更改映像源

Question

使用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来更改图像？

Answer 1

您可以使用jQuery的ATTR()功能。例如，如果您的img标记具有id属性“my_Image”，您可以这样做：

<img id="my_image" src="first.jpg"/>

然后，您可以更改src如下所示的jQuery图像：

$("#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);
    }});

Answer 2

想了解更多信息。我尝试使用jQuery中的attr方法为广告图像设置src属性，例如：$("#myid").attr('src', '/images/sample.gif');

这个解决方案是有用的，它是有效的，但是如果改变路径也改变了图像的路径，而不能工作。

我一直在寻找解决这个问题的方法，但一无所获。

解决方案是将“\”放在路径的开头：$("#myid").attr('src', '\images/sample.gif');

这个技巧对我非常有用，我希望它对其他人也有帮助。