2017-02-09 46 views
-2

我正在努力創建播放和停止音樂的廣播播放器的切換按鈕,因爲我不知道如何編寫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

你toggleSound功能缺少一個右大括號,這是一個可行的解決方案

<!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>

radio.soundObject.paused返回,這就是爲什麼我用它來切換一個布爾值在比賽和暫停之間。無論你使用的是什麼api/library,都可以閱讀它以更好地理解它。

+0

非常感謝azs06,它看起來很容易,但我很迷茫,在編碼! – snowblood

+0

你有一個想法,爲什麼這不是在Safari上工作:(? – snowblood

+0

不知道爲什麼不在safari上工作,流(http://radiocambodia.live:8000/stream.ogg)似乎不是負載在safari上。 – azs06