見出し画像

複数の音声ファイルボタンがあるページ

なるものを作ろうとしたら、音声ボタンはリンクに飛ぶボタンほど単純ではないんですね。なめてました…

jsファイルも久しぶり。getElementByIdも久しぶり。など久しぶり祭りの中作るもjsファイルで作るとどのボタンも一つのファイルしか再生されない!

調べたり先生に聞いたりしたけど、解決できず!結局htmlにそれぞれコードをいれる形にしました。

特に苦労したのがfunction。これをringのままにしているとid変えても同じファイルしか再生してくれなかったので、これも番号を付けたら区別してくれました。

本当はjsファイルで一元化出来るんだろうけど、初心者なので今日はこれで良しとします。(今度、先生に聞こう。。)

<p><input type="button" value="①英語では?" onclick="ring1();"></p>
       <audio id="cheetah" preload="auto">
         <source src="sound/cheetah.mp3" type="audio/mp3">
       </audio>
       <script>
         function ring1() {
           document.getElementById("cheetah").play();
         }
       </script>


この記事が気に入ったらサポートをしてみませんか?