在 html 和/或 javascript 中禁用音频自动播放

Question

我是编码新手，也是 stackoverflow 新手！到目前为止，我已经完成了大约 30 个小时的编码工作，我的努力就是您所说的“弗兰肯斯坦方法”。希望我能得到一些建议和解决我的问题...

所以...我正在尝试建立一个网站，并且我已经设法使用 HTML5、CSS 和 javascript 编写了一个带有播放列表的音频播放器，但是当页面打开时音频会自动播放，我不希望这样发生！

我尝试在 HTML 和 javascript 中使用各种 sn-ps，例如 autoplay="false" 和 autostart="false"，但似乎没有任何效果。请帮忙！

我已附上我的代码以供参考 - 欢迎所有反馈，因为我渴望学习，但如前所述，我是编码新手，需要快速提高我的技能！

提前谢谢你！

// P1.js
function audioPlayer(){
        var currentSong = 0;
        $("#audioPlayer")[0].src = $("#playlist li a")[0];
        $("#audioPlayer")[0].play();
        $("#playlist li a").click(function(e){
           e.preventDefault(); 
           $("#audioPlayer")[0].src = this;
           $("#audioPlayer")[0].play();
           $("#playlist li").removeClass("current-song");
            currentSong = $(this).parent().index();
            $(this).parent().addClass("current-song");
        });

        $("#audioPlayer")[0].addEventListener("ended", function(){
           currentSong++;
            if(currentSong == $("#playlist li a").length)
                currentSong = 0;
            $("#playlist li").removeClass("current-song");
            $("#playlist li:eq("+currentSong+")").addClass("current-song");
            $("#audioPlayer")[0].src = $("#playlist li a")[currentSong].href;
            $("#audioPlayer")[0].play();
        });
    }

// Inline script

// loads the audio player
audioPlayer("P1.js");

.playernh {
    position: absolute;
    left: 400px;
    top: 1050px;
    list-style: none;
    height:75px;
    width:400px;
    background-color: pink;
}
#playlist li a {
    font-family: "Courier New";
    font-size: 24px;
    background-color: red;
    color:black;
    text-decoration: none;
}
#playlist .current-song a {
    color:yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="playernh">

<audio id="audioPlayer" controls="controls">
    Sorry, your browser doesn't support html5!
</audio>
<ul id="playlist">
    <li class="current-song"><a href="Schietwetter - Naked Healer - 01 Naked Healer.mp3">Naked Healer</a></li>
    <li><a href="Schietwetter - Naked Healer - 02 Brown Matter.mp3">Brown Matter</a></li>
    <li><a href="Schietwetter - Naked Healer - 03 Maos.mp3">Maos</a></li>
    <li><a href="Schietwetter - Naked Healer - 04 Schwerlast.mp3">Schwerlast</a></li>
    <li><a href="Schietwetter - Naked Healer - 05 Swallow.mp3">Swallow</a></li>
    <li><a href="Schietwetter - Naked Healer - 06 Tanzer.mp3">Tanzer</a></li>
    <li><a href="Schietwetter - Naked Healer - 07 Edwards War.mp3">Edwards War</a></li>
    <li><a href="Schietwetter - Naked Healer - 08 Substanz.mp3">Substanz</a></li>
    <li><a href="Schietwetter - Naked Healer - 09 Wolfkopf.mp3">Wolfkopf</a></li>
    <li><a href="Schietwetter - Naked Healer - 10 Boni.mp3">Boni</a></li>
    <li><a href="Schietwetter - Naked Healer - 11 Moth.mp3">Moth</a></li>
</ul>
</div>

Answer 1

你马上打电话给audioPlayer，然后audioPlayer...

function audioPlayer(){
  var currentSong = 0;
  $("#audioPlayer")[0].src = $("#playlist li a")[0];
  $("#audioPlayer")[0].play();

...立即开始播放音乐。取出那里的.src 和.play 行。 （不过，请将它们留在 click 处理程序中！）

_{另外，audioPlayer 不接受参数。一旦你的 Javascript 开始运行，浏览器就已经把你所有的脚本拼成了一团糟的代码。那时还没有"p1.js" 的概念。}