javascript js音楽の停止ボタン - mp3

Question

再生中にmp3を停止するのが難しいです。

//html code 
    <button onclick="musicHint()">Start music</button> 
    <button onclick="musicStop()">Stop music</button> 

//js code 
    //music starts 
    function musicHint(){ 
    console.log("music start button working!"); 
    new Audio('snoop.mp3').play(); 
    } 
    //music stop 
    function musicStop(){ 
    console.log("music start button problems"); 
    new Audio('snoop.mp3').pause(); 
} 

line - newAudio（ 'snoop.mp3'）。pause（）; mp3を一時停止していません

アイデア？ありがとう

Answer 1

常に新しいオブジェクトを作成している同じオブジェクトでは作業していません。 あなたではなく、新しいものを作成するよりも、同じAudioオブジェクトにpause()を呼び出すことができるようにあなたは、変数を必要とするこの

//html code 
    <button onclick="musicHint()">Start music</button> 
    <button onclick="musicStop()">Stop music</button> 

//js code 
    var songObj=new Audio('snoop.mp3'); 
    //music starts 
    function musicHint(){ 
    console.log("music start button working!"); 
    songObj=songObj.play(); 
    } 
    //music stop 
    function musicStop(){ 
    console.log("music start button problems"); 
    if(songObj){ 
     songObj.pause(); 
    } 
} 

Answer 2

を試してみてください。

//html code 
    <button onclick="musicHint()">Start music</button> 
    <button onclick="musicStop()">Stop music</button> 
//js code 
    //music starts 
    var audio = new Audio('snoop.mp3'); 
    function musicHint(){ 
    console.log("music start button working!"); 
    audio.play(); 
    } 
    //music stop 
    function musicStop(){ 
    console.log("music start button problems"); 
    audio.pause(); 
} 

Answer 3

再生中の曲の参照が保存されていないためです。

Audioオブジェクトの参照を変数に格納し、そのオブジェクトを再生または一時停止して、同じオブジェクトで作業していることを確認します。

Answer 4

Audio()インスタンスを1つ作成し、そのインスタンスをmusicHintとmusicStopの関数で参照してください。 canplayハンドラーをAudioインスタンスにアタッチして、<button>エレメントにwindowloadイベント、そしてcanplayハンドラーにイベントハンドラーをアタッチします。 Audioが.play()

<script> 
 
    window.onload = function() { 
 

 
    var audio = new Audio("https://upload.wikimedia.org/wikipedia/commons/6/6e/Micronesia_National_Anthem.ogg"); 
 

 
    function musicHint() { 
 
     console.log("music start button working!"); 
 
     if (audio.paused || audio.currentTime === 0) { 
 
     audio.play() 
 
     } 
 
    } 
 
    //music stop 
 
    function musicStop() { 
 
     console.log("music start button problems"); 
 
     audio.pause(); 
 
    } 
 

 
    audio.oncanplay = function() { 
 
     alert("audio loaded"); 
 
     
 
     document.getElementById("musicHint") 
 
     .onclick = musicHint; 
 

 
     document.getElementById("musicStop") 
 
     .onclick = musicStop; 
 
    } 
 
    } 
 
</script> 
 

 
<button id="musicHint">Start music</button> 
 
<button id="musicStop">Stop music</button>