How to toggle pause/play audio with button click in Pure Javascript?

Ave

I find in Stackoverflow before but almost example working in element.

Have any method toggle click play/pause when using Javascript?

HTML Code:

<button id="music" class="play-song"></button>

My JS code look like:

<script>
const elem = document.getElementById("music");
if (elem) {
elem.addEventListener ("click", playMusic, false);
}

function playMusic() {
  var musik= new Audio("/songs/1.mp3");
  musik.play();
  var current = this;
  if (current != elem) {
    elem.classList.remove('mute-audio');
  } else if (current.classList.contains('mute-audio') === true) {
    current.classList.remove('mute-audio');
  } else {
    current.classList.add('mute-audio');
  }
}
</script>
Asif Jalil

const elem = document.getElementById("music");
if (elem) {
elem.addEventListener ("click", playMusic, false);
}

var musik= new Audio("https://xomkey.com/wp-content/uploads/songs/xomkey-song.mp3");

function playMusic() {  
  if(musik.paused){
    musik.play();
    // do your other task
  } else {
    musik.pause();
    // do your other task
  }
  
}
<button id="music" class="play-song">Play/Pause</button>

You can play and pause with this piece of code like toggle. For audio, there are many more interesting methods.

For your reference:

https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement

https://developer.mozilla.org/en-US/docs/Web/API/HTMLAudioElement

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

How to toggle audio play() pause() with a button click?

Click button to toggle class of parent element - pure javascript

How to auto click a toggle button?

How to toggle class by a button click?

Button rotation is not working on every click - Pure JavaScript

jquery to pure javascript ul li button click

javascript: toggle a button's behavior after click

toggle display in pure javascript

Toggle image in pure javascript

Isotope Click to Toggle - How to use close button

how to toggle input value on button click

How to click into toggle button using appium and java?

How to get id of a button from a group of buttons on click event using Pure Javascript

How can I convert an 'on click' button for history.back into pure JavaScript in template.js?

How to disable Bootstrap Toggle-Buttons on click at another Toggle Button?

How to play audio on button click (recycler view)

Pure Javascript: What is the best way to click a button in the group of buttons in a calculator?

How have toggle dropdown on button click and close on outside click?

How to make this button behavior using pure Javascript?

toggle button on click in jquery

Change toggle button on click?

control a toggle by a button click

How to toggle audio playback using GPIO push button?

How to toggle audio play() pause() with one button or link?

How to know if audio ended in React js with toggle button

Toggle script problems how can I fix this in pure JavaScript? No jQuery

How to toggle two span texts with pure Javascript, No jQuery please

How do I toggle value and class of a button on button click

Toggle VideoView's audio with a Button