为广播播放器创建切换开始/停止按钮

时间:2017-02-09 17:09:47

标签: javascript css button radio icecast

我正在努力创建一个播放和停止音乐的无线电播放器的切换按钮,因为我不知道如何编写javascript代码......开发人员帮我在服务器上安装Icecast但不幸的是他很忙。我所拥有的只是一个HTML,可以在加载页面时自动播放音乐。

非常感谢!!这是代码:

<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://radiocambodia.live/sound_manager/script/soundmanager2-jsmin.js"></script>
<script src="http://radiocambodia.live/Helpers.js"></script>
<script src="http://radiocambodia.live/WebRadio.js"></script>
<script>
        var stream_url = "http://radiocambodia.live:8000/stream.ogg";

        var radio = new WebRadio(stream_url);

        radio.init({
            onloaded: function() {
                console.log("Playing !");
                radio.soundObject.play();
            },

            onplaying: function() {

            }
        });

    </script>
</head>

<body>
<a href="#"><img src="http://radiocambodia.live/pause.png" width="45" height="45" id="stopbutton" onclick='toggleSound()';  /></a> 
<script type="text/javascript">
function toggleSound() {

    if (radio.soundObject.play){
document.getElementById('soundObject.stop').src='stop.png';
}else{
document.getElementById('soundObject.play').src='play.png';
}

</script>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

你的toggleSound函数缺少一个结束大括号,这是一个可行的解决方案

&#13;
&#13;
<!DOCTYPE html>
<html lang="en">
<head>
</head>

<body>
<img id="togglePlay"  src="http://radiocambodia.live/pause.png" width="45" height="45" id="stopbutton" onclick='toggleSound()';  />
<script src="http://radiocambodia.live/sound_manager/script/soundmanager2-jsmin.js"></script>
<script src="http://radiocambodia.live/Helpers.js"></script>
<script src="http://radiocambodia.live/WebRadio.js"></script>

<script type="text/javascript">
    var stream_url = "http://radiocambodia.live:8000/stream.ogg";

    var radio = new WebRadio(stream_url);

    radio.init({
        onloaded: function() {
        console.log("Playing !");
        radio.soundObject.play();
    },

    onplaying: function() {

    }
    });
    function toggleSound() {
        if (radio.soundObject.paused){
            radio.soundObject.play();
            document.getElementById('togglePlay').src='http://radiocambodia.live/pause.png';
        }else{
            radio.soundObject.pause();    
            document.getElementById('togglePlay').src='http://radiocambodia.live/play.png';         
        }
    }

</script>
</body>
</html>
&#13;
&#13;
&#13;

radio.soundObject.paused返回一个布尔值,这就是我用它在播放和暂停之间切换的原因。无论您使用何种api /库,请阅读它的文档以更好地理解它。