我知道还有其他类似问题,但我一直尝试关注这些问题,但我不知道自己到底在做什么错。我已声明pic
变量已链接到具有相应ID“ pic”的图像,并且尝试了许多不同的示例,并尝试遵循类似这样的其他问题,但无济于事。
-真正的问题----
我希望通过单击按钮将图像的src更改为工作区中的另一个src。
HTML:
<img class="trans" id="pic" src="images/link_rouge.png" alt="" width="1000" height="333" />
JavaScript:
var pic = document.getElementById('pic');
function rouge() {
pic.src = "images/link_rouge.png";
}
function blue() {
pic.src = "images/link_blue.png";
}
我知道这些功能已经可以使用按钮了,因为它们会影响页面上某些更改颜色的div,唯一不变的就是图像。
该
EventTarget.addEventListener()
方法在调用的EventTarget上注册指定的侦听器。
使用addEventListener
overbutton
元素附加click
事件,并将您的处理程序函数绑定到这些事件。
var pic = document.getElementById('pic');
function rouge() {
pic.src = "http://www.projectvictorycosplay.com/images/zelda/Links/3198_render_link.png";
}
function blue() {
pic.src = "http://bin.smwcentral.net/u/1944/Link%2BBlue%2BTP%2Bshrunk.png";
}
document.getElementById('btn1').addEventListener('click', rouge);
document.getElementById('btn2').addEventListener('click', blue);
img {
width: 200px;
}
<button id='btn1'>rouge</button>
<button id='btn2'>blue</button>
<br/>
<img class="trans" id="pic" src="http://www.projectvictorycosplay.com/images/zelda/Links/3198_render_link.png" alt="" width="1000" height="333" />
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句