我的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标记的id属性为“my_image”,则可以执行以下操作:
<img id="my_image" src="first.jpg" alt="Insert link 1 alt text here" />
然后,您可以使用jQuery更改图像的src,如下所示:
$("#my_image").attr("src","second.jpg");
要将其附加到单击事件,可以编写:
$('#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);
}
});
我在尝试调用“重新注册”按钮时遇到了同样的问题。经过一些搜索,现在以下功能在几乎所有著名的浏览器(chrome、Firefox、IE、Edge…)中都能正常工作:
function recaptcha(theUrl) {
$.get(theUrl, function(data, status){});
$("#captcha-img").attr('src', "");
setTimeout(function(){
$("#captcha-img").attr('src', "captcha?"+new Date().getTime());
}, 0);
}
“theUrl”用于呈现新的captcha图像,在您的情况下可以忽略。最重要的一点是生成新的URL,迫使FF和IE重新阅读图像。