Question

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

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

我觉得很简单但太简单了，因为我发现的每一个教程都涉及HTML5及其新标签或flash或者我不需要的彩色播放器。

我将如何实现这一目标？纯粹的javascript或Jquery都可以。

我提前感谢您的帮助

Answer 1

您是否有使用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 =''; audio.load（）; //什么都不加载，所以停止（音频API中没有stop（））

使用javascript播放音频（没有HTML5或可见播放器）

1 个答案: