用 JS 播放和停止声音 JQuery

Question

我有办法用一个简单的命令来播放声音，https://github.com/admsev/jquery-play-sound，但是我正在播放的音频文件大约有 2 分钟长。我需要一种使用 javascript 或 jquery 命令来 stop/silence 音频的方法。有谁知道我该怎么做？我真的不想要一个停止声音的按钮，除非它是一个常规的 html 按钮，除了停止声音之外还可以做其他事情。

Answer 1

您链接的 jQuery playSound 库不支持暂停。我认为最好选择一个支持暂停的不同库，这样你就不必自己编写该功能了。

我以前使用过 howler.js 库，它对我来说效果很好。以下是您将如何使用 howler.js:

<!-- to load the library on the page -->
<script src="howler.js">

// to create and play the sound
var backgroundMusic = new Howl({
  urls: ['music.mp3', 'music.ogg'],
}).play();

// to pause the sound
// (make sure the variable `backgroundMusic` is accessible)
backgroundMusic.pause();

// to stop the sound
backgroundMusic.stop();

Answer 2

没有jQuery，没有插件，只有一个浏览器。这是播放和暂停一个 MP3 的一个按钮。你没有指定你想要一个按钮做什么额外的事情，所以我没有给那个单独的按钮添加任何额外的功能。您还想让这个单独的按钮执行哪些其他操作？

顺便说一句，如果您希望音频停止而不是暂停：

<style> 块中有一行需要取消注释，还有一行需要注释。
<script> 块中有一行需要取消注释。

<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <style>
    .play:before {
      content: 'b6';
    }
    .pause:before {
      content: '5a5a';  /*Uncomment this line for pause */
      /* content: 'a0'; */ /*Uncomment this line for stop */
    }
  </style>

</head>

<body>

  <button id="button" class="play">
    <audio id="audio" src="http://glpjt.s3.amazonaws.com/so/av/pf-righteous.mp3"></audio>
  </button>

  <script>
    var audio = document.getElementById('audio');
    var button = document.getElementById('button');

    button.addEventListener('click', playPause, false);

    function playPause() {
      if (!audio.paused) {
        audio.pause();
        // audio.currentTime = 0; // Uncomment this line for stop
        button.classList.remove('pause');
        button.classList.add('play');
      } else {
        audio.play();
        button.classList.remove('play');
        button.classList.add('pause');
      }
    }
  </script>
</body>

</html>

用 JS 播放和停止声音 JQuery

Playing and Stopping Sound with JS and JQuery

javascript

audio

jquery

pause