[英]Javascript img tag src switch function not working
I have a small app the uses 3 images as buttons, the images are different colors, above the image buttons there is a big pair of glasses, depending on what color button you press the color of the glasses will change to match the color of the button that was pressed. 我有一个小应用程序使用3个图像作为按钮,图像是不同的颜色,图像按钮上方有一副大眼镜,根据你按什么颜色按钮,眼镜的颜色会改变,以匹配颜色的按下的按钮。 The problem is I am getting a "Cannot set src to null" error. 问题是我得到一个“无法将src设置为null”错误。
Here is a jsfiddle: http://jsfiddle.net/vAF8S/ 这是一个jsfiddle: http : //jsfiddle.net/vAF8S/
Here is the function 这是功能
//Functions that change the glasses image
function changeColor(a){
var img = document.getElementById("imgG");
img.src=a;
}
you have two Id's for the tag. 你有两个Id标签。 you should have only one ID. 你应该只有一个ID。 change your html. 改变你的HTML。
<section id="banner" >
<img id="imgG" src="images/orangeG.png"><br>
<img id="wcolorButton" src="images/whiteT.png" />
<img id="bcolorButton" src="images/blueT.png" />
<img id="ocolorButton" src="images/orangeT.png" onClick="changeColor('images/whiteG.png')" />
</section>
you are getting this error because you have applied ID twice to the same element 您收到此错误,因为您已将ID两次应用于同一元素
use this HTML 使用此HTML
<section id="banner" >
<img class="glasses" id="imgG" src="images/orangeG.png"><br>
<img class="wcolorButton" src="images/whiteT.png" />
<img class="bcolorButton" src="images/blueT.png" />
<img class="ocolorButton" src="images/orangeT.png" onClick="changeColor('images/whiteG.png')" />
</section>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.