[英]Changing html <input> image through javascript, cannot call method addEventListener
I am trying to get an input image to change through javascript when clicked but I get the following error through Google Chrome debug: 我正在尝试获取输入图像,以在单击时通过javascript进行更改,但通过Google Chrome调试得到以下错误:
Uncaught TypeError: Cannot call method 'addEventListener' of undefined
The Following is my HTML code: 以下是我的HTML代码:
<section id="skin">
<video id="mainPlayer" width="640" height="360">
<source src="video.mp4">
</video>
<nav>
<div id="buttons">
<input type="image" src="play_button.png" id="playButton" width="22" height="22">
</div>
<div id="defaultBar">
<div id="progressBar"></div>
</div>
<div style="clear:both"></div>
</nav>
And this is my javascript code: 这是我的JavaScript代码:
function doFirst() {
mainPlayer = document.getElementById('mainPlayer');
playButton = document.getElementsByName('playButton')[0];
playButton.addEventListener('click', playOrPause, false);
}
function playOrPause() {
if (!mainPlayer.paused && !mainPlayer.ended) {
mainPlayer.pause();
playButton.src="controls.png";
window.clearInterval(updateBar);
} else {
mainPlayer.play();
playButton.src="play_button.png"
updateBar = setInterval(update, 500);
}
}
window.addEventListener('load',doFirst,false);
playButton = document.getElementsByName('playButton')[0]; playButton = document.getElementsByName('playButton')[0]; you will get an empty array here 你会在这里得到一个空数组
you need to add name attribute to your input tag or change to 您需要在输入标签中添加名称属性或更改为
playButton = document.getElementById('playButton');
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.