.addEventListener不起作用

Question

My code is fairly simple. The .addEventListener isn't working for 'click' or 'change.' I had to put "onclick" inside my HTML but, as far as I know, there's no 'onChange' event in HTML. I'm trying to make a custom video player but the seek slider isn't working out. I was wondering how I could make .addEventListener work? (ps, it hadn't worked before this question either) HTML:

<div id="video_player_box">
            <video id="my_video" controls autoplay>
                <source src="/videos/video.mp4">
            </video>
            <div id="video_control_bar">
                <button id="playpausebutton" onclick="playPause()">Pause</button>
                <input id="seekslider" type="range" min="0" max="100" value="0" step="1">
            </div>
        </div>

and JS:

var vid, playBtn, seekslider;

            function initPlayer() {
                vid = document.getElementById("my_video");
                playBtn = window.getElementById("playpausebutton");
                seekslider = window.getElementById("seekslider");

                seekslider.addEventListener("change", vidSeek, false);
            }

            window.onload = initPlayer;

            function playPause() {

                if (vid.paused) {
                    vid.play();
                    playBtn.innerHTML = "Pause";
                } else {
                    vid.pause();
                    playBtn.innerHTML = "Play";
                }
            }
            function vidSeek() {
                var seekTo = vid.duration * (seekslider.value / 100);
                vid.currentTime = seekTo;
            }

Answer 1

fix your js code with this code:

var vid, playBtn, seekslider;

        function initPlayer() {
            vid = document.getElementById("my_video");
            playBtn = document.getElementById("playpausebutton");
            seekslider = document.getElementById("seekslider");
            seekslider.addEventListener("change", vidSeek, false);
        }

        window.onload = initPlayer;
        function playPause() {
            if (vid.paused) {
                vid.play();
                playBtn.innerHTML = "Pause";
            } else {
                vid.pause();
                playBtn.innerHTML = "Play";
            }
        }

        function vidSeek() {
            var seekTo = vid.duration * (seekslider.value / 100);
            vid.currentTime = seekTo;
        }