HTMLを編集
<button id="btn">再生</button>
<button id="btn2">停止</button>
<audio id="audio"></audio>
これらを追加する
javascriptを書く
HTMLの中にscriptタグをかいてHTMLにjavascriptを書くか、
javascriptファイルを作ってそれでjavascriptを書くか。
今回はめんどくさいのでHTMLのなかにjavascriptを書きます。
headタグ内に書いてみてください
。
エラーでたら、bodyタグ内に書いてみましょう。
<script>
var btn = document.getElementById("btn"); //document.getElementByIdを使ってHTMLのbtnというIDを取得
var btn2 = document.getElementById("btn2");//document.getElementByIdを使ってHTMLのbtn2というIDを取得
btn.addEventListener('click', function(){ //もしbtn(再生)をクリックしたら..
audio.src='ここにmp3ファイル名を書く';
audio.play(); //audioを再生
});
btn2.addEventListener('click', function(){
audio.pause(); //audioを止める
audio.currentTime = 0; //時間を0に
});
</script>
これで再生と停止ができたみたいです!