javascript - 为什么我的 JS 函数不能与我的按钮一起使用？

Question

• 尝试制作自己的播放按钮
• 使用 HTML 音频标签可以正常加载和播放音频
• 错误控制台显示“无法加载资源https://open.scdn.co/static/embed.2019-03-05_152e14cd.js.map ”
• 歌曲.play(); 输入到 JS 控制台工作正常
• 按钮不激活功能！

HTML

                <audio id="song" controls> <source src="song.mp3"></source>
                </audio>
                <button class="controls" id="play">Play</button>

JavaScript

            var play = document.getElementById("song");
            song.addEventListener ("click", buttonActions);
            function buttonActions(event){
                song.play();
            }

标签： javascript

Answer 1

您将事件处理程序附加到<audio>元素，而不是<button>元素。

代替：

var play = document.getElementById("song");
song.addEventListener ("click", buttonActions);    
function buttonActions(event){
    song.play();
}

它应该是：

var play = document.getElementById("play");
play.addEventListener ("click", buttonActions);    
function buttonActions(event){
    var song = document.getElementById("song");
    song.play();
}