2

我想在单击图像链接时播放曲目，并在再次单击时停止播放。我没有使用 HTML5，我没有使用音频标签，也不想在播放曲目时显示任何播放器。这应该尽可能跨浏览器......

我点击，我听到了曲目，我再次点击，它停止了。

足够简单，但我猜想太简单了，因为我发现的每个教程都涉及 HTML5 及其新标签或 Flash 或一些我不需要的彩色播放器。

请问我该如何实现？纯 javascript 或 Jquery 都可以。

我提前谢谢你的帮助

4

1 回答 1

3

您不使用 HTML5 音频标签是否有特殊原因？因为您可以设置为不显示控件并将其用于使用 javascript 播放/停止，并根据需要将图像从播放切换到停止。使用 jQuery：

你有这个图像：

<a href="#" id="audioPlayStop" title="stop">
    <img src="images/stop.png" />
</a>

还有这个不可见的音频标签：

<audio id="audio">
<source src="somethingtoplay.mp3" type="audio/mpeg" />
</audio>

var audio = document.getElementById('audio'); // $('#audio') won't work for audio API!
    $('#audioPlayStop').toggle( 

        function () {


            $(this).attr('title', 'play');
            $(this).add('img').attr('src', 'images/play.png');

            audio.pause();

            console.log('Paused');
        }, 
        function () {
            $(this).attr('title', 'stop');
            $(this).add('img').attr('src', 'images/stop.png');

            audio.play();           

            console.log('Play started');
        } //function
    );

这个脚本实际上是暂停而不是停止。但是您可以知道如何阻止它，因为您可以使用 audio.src = ''; 来阻止它。音频.load(); // 什么都不加载，所以它停止（音频 API 中没有 stop()）

于 2013-02-25T18:06:47.240 回答