点击js播放声音答案

【问题标题】：play sound by click js点击js播放声音
【发布时间】：2016-06-10 11:00:35
【问题描述】：

我在播放音乐时遇到问题。它不播放。我想通过点击按钮来播放音乐。

<script>
  $(document).ready(function() {
    $('.button').submit(function() {
      var audio = document.getElementById('audioFile');
      audio.play();
    });
  });
</script>
</head>

<body>
  <audio id="audioFile">
    <source src="font/sound.mp3" type="audio/mpeg">
  </audio>
  <div class="inputMessage">

    <form method="POST" action="/index.php">
      <textarea class="chatMessage" name="text" placeholder="Текст сообщения"></textarea>
      <br>
      <input class="button" type="submit" name="enter" value="Отправить">
      <input type="reset" value="Очистить">
    </form>
  </div>
</body>

【问题讨论】：

试试这个解决方案：stackoverflow.com/a/18628124/2815635
您看到什么错误信息？调试显示什么？
我需要从 textarea 发送文本，当我点击按钮时，我应该会听到声音
document.getElementById('audioFile'); 不指向src 标记中的src 属性。尝试更改参考。当你有 jquery 时，为什么要使用 JavaScript 代码来获取元素属性？？
我真的不知道如何调试，但是在日志中我什么也看不到

标签： javascript html

【解决方案1】：

第一件事：.submit() 方法存在于表单上，而不是输入上。您可以改用.click() 方法。第二件事：当你点击你的按钮时，表单被发送并且页面重定向到/index.php。为了使播放声音成为可能，您必须保持在同一页面上（请求仍然可以异步发送）。以下是防止加载新页面的方法：

$('.button').click(function(ev) { // jQuery passes the event as a parameter
  var audio = document.getElementById('audioFile');
  audio.play();
  ev.preventDefault(); // and we prevent the form from being sent
});

看演示：https://jsfiddle.net/s48jcrvc/1/

【讨论】：

它可以工作，但现在我有另一个问题：当我点击按钮时，歌曲开始播放，但是当我再次点击按钮时，它不会发送表单，直到歌曲播放。如何解决？当我按下按钮时，歌曲应该从头开始
在播放前设置audio.currentTime = 0;。如果有帮助，请接受我的回答。
最后一个问题是音乐播放完了怎么重新播放？
我刚刚找到答案：如果我没记错的话，我应该输入audio.loop=true;
很高兴听到这个消息！