更改图像src以扩展/折叠功能(JQ或JS)

时间:2012-06-01 17:12:53

标签: javascript jquery html

我已经尝试了在此网站上找到的几种方法来改变我的脚本" +"和" - "展开/折叠按钮图像,但我还没有找到合适的修复/方法。

目前,我使用普通JS如下:

function swapimg(id) {
if(document.getElementById(id).src='images/bullet_expand.png')
{document.getElementById(id).src='images/bullet_expanded.png'}
else {document.getElementById(id).src='images/bullet_expand.png'}
}

和按钮:

<a href="javascript:void();" onclick="toggle_visibility('item1'); swapimg('phb');">
<img src="images/bullet_expand.png" border="0" style="padding-right: 5px;" id="phb" alt="">
</a>

第一次点击确实会改变图像,但第二次点击不会做任何事情。我有使用&#34; getElementById&#34;可能不是标准调用,所以使用JQuery也是我会考虑的选项。

1 个答案:

答案 0 :(得分:3)

您需要==而不是=

而不是比较您分配的值

而不是:

document.getElementById(id).src='images/bullet_expand.png'

使用

document.getElementById(id).src=='images/bullet_expand.png'

jQuery的:

if(jQuery('#'+id).attr('src') == 'images/bullet_expand.png') {
   jQuery('#'+id).attr('src','images/bullet_expanded.png');
} else {
   jQuery('#'+id).attr('src','images/bullet_expand.png');
}

使用Javascript:

if(document.getElementById(id).src.indexOf('/images/bullet_expand.png') > 0) {
    document.getElementById(id).src='images/bullet_expanded.png';
}
else {
    document.getElementById(id).src='images/bullet_expand.png';
}