-3

I am thinking to make Moodly.site I can add one audio and can make users play it on-click but how to make 1+ audio to be played.I am not sure, can I make it with just Vanilla JS or I need to work with any framework.

Is there any tag in HTML which can allow me to do this or it is solely JS's part?

1 Answers1

2

var a1 = document.getElementById("a1");
var a2 = document.getElementById("a2");

var b1 = document.getElementById("b1");
var b2 = document.getElementById("b2");

b1.addEventListener("click", function () {
        a1.play();
        
 });
 b2.addEventListener("click", function () {
        a2.play();
 });
<audio id="a1" src="https://www.learningcontainer.com/wp-content/uploads/2020/02/Kalimba.mp3">
            Your browser does not support the
            <code>audio</code> element.
    </audio>
<audio id="a2" src="https://www.learningcontainer.com/wp-content/uploads/2020/02/Kalimba.mp3">
            Your browser does not support the
            <code>audio</code> element.
    </audio>
    <button id="b1">1</button>
    <button id="b2">2</button>

Make sure to change the audio files

Edit: added buttons-js

Neptotech -vishnu
  • 1,096
  • 8
  • 23