无法使用JS在MP3上启动自动播放功能

Question

我无法自动播放mp3文件。我的mp3文件div被称为“ lyd”。

试图用js制作，但是没有用。

let lyd = document.getElementById("lyd");
lyd.play();

它不输出声音。

HTML

<audio type="audio/mpeg" id="lyd" src="../music/Space.mp3"></audio> 

我的控制台中的错误是：

  

未捕获（承诺）的DOMException

Answer 1

某些浏览器会阻止音乐自动播放。对于Chrome，他们更改了autoplay policy。因此，您应该始终查看play函数返回的Promise，以查看是否被拒绝：

var lyd = document.getElementById( 'lyd' );
var promise = lyd.play();

if ( promise !== undefined ) {
  promise.then(_ => {
    // Autoplay started!
  } ).catch( error => {
      // Autoplay was prevented.
      // Show a "Play" button so that user can start playback.
      var btn = document.getElementById( 'btnPlay' );

      btn.style.visibility = 'visible'
      btn.onclick = function() {
      lyd.play()
    }
  } );
}

#btnPlay {
  visibility: hidden
}

<audio type="audio/mpeg" id="lyd" src="https://www.zapsplat.com/wp-content/uploads/2015/sound-effects-two/musical_compressed_house_or_trance_drum_loop.mp3"></audio>

<input id="btnPlay" name="" type="button" value="Play Sound">

它仍然在控制台中引发错误，但是至少正在播放音频。