编程语言
首页 > 编程语言> > 使用Javascript切换图像src属性

使用Javascript切换图像src属性

作者:互联网

我试图使用Javascript更改HTML图像src.我有两个图像Plus.gif和Minus.gif.我已经插入了HTML img标签并编写了一个Javascript函数来更改单击时的图像src.

问题是我想在用户点击图片时再次将其更改回来.
例如,当加载页面时,Plus.gif显示,当用户点击它时,图像会变为Minus.gif.

我想要它,当图像是Minus.gif并且用户点击它时,应该将其更改为Plus.gif.

这是我的Javascript函数:

<script language="javascript" type="text/javascript">
  function chngimg() {
    var img = document.getElementById('imgplus').src; //= 'Images/Minus.gif';

    if (img) {
      document.getElementById('imgplus').src = 'Images/Minus.gif';
    } else if (!img) {
      document.getElementById('imgplus').src = 'Images/Plus.gif';
      alert(img);
    }

  }
</script>

图片标签:

<img id="imgplus" alt="" src="Images/Plus.gif" onm ouseover="this.style.cursor='pointer'" onclick="chngimg()"   />

解决方法:

查看我为使其工作所做的更改

<script language="javascript" type="text/javascript">
    function chngimg() {
        var img = document.getElementById('imgplus').src;
        if (img.indexOf('Plus.gif')!=-1) {
            document.getElementById('imgplus').src  = 'Images/Minus.gif';
        }
         else {
           document.getElementById('imgplus').src = 'Images/Plus.gif';
       }

    }
</script>

<img id="imgplus" alt="" src="Images/Plus.gif" onm ouseover="this.style.cursor='pointer'" onclick="chngimg()"   />

希望能解决你的问题.

标签:javascript,imageurl
来源: https://codeday.me/bug/20191001/1839819.html