Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Кнопка нажатия/отжатия паузы для нескольких аудио (https://javascript.ru/forum/dom-window/79140-knopka-nazhatiya-otzhatiya-pauzy-dlya-neskolkikh-audio.html)

VolKTieR 23.12.2019 16:34

Кнопка нажатия/отжатия паузы для нескольких аудио
 
Здравствуйте! Я написал такой вот код:
<div class="container">
	<ul class="actions special">
		<li><a href="#one" class="button primary scrolly">
			<button  href="#one" class="button primary scrolly" onclick="document.getElementById('audio').play()">Начать</button>
			</a>
		</li>
         </ul>
</div>

<audio id="audio">
	<source src="audio/1.mp3" type="audio/mpeg" >	
</audio>
<audio id="audio2">			
	<source src="audio/2.mp3" type="audio/mpeg" >	
</audio>
<audio id="audio3">
	<source src="audio/3.mp3" type="audio/mpeg" >	
</audio>
<audio id="audio4">
	<source src="audio/3.mp3" type="audio/mpeg" >	
</audio>
<button  href="#two" class="goto-next scrolly" onclick="document.getElementById('audio2').play()">Next</button>
<button  href="#three" class="goto-next scrolly" onclick="document.getElementById('audio3').play()">Next</button>
<button  href="#four" class="goto-next scrolly" onclick="document.getElementById('audio4').play()">Next</button>


<div class="fixedbut" id="sebut" ></div>




<script>
    document.getElementById("sebut").onclick = function()
    {
      var audio1 = document.getElementById("audio");

      if(audio1.paused == true) 
      {
        document.getElementById("audio").play();
      }
      else if (audio1.paused == false)
      {
        document.getElementById("audio").pause();
      }
    }
</script>


Подскажите пожалуйста, как правильно построить скрипт, чтобы кнопка под айди "sebut" ставила на паузу и снимала с неё любое включенное аудио кнопками Начать и next, и если аудио какой-либо из кнопок Начать или Next уже включено, то при нажатии на их подобную оно останавливалось и начиналось другое. :help: :help: :)
P.S. "sebut" - постоянная кнопка, висит в углу экрана)

Опан1 25.12.2019 23:41

В этом случае проще всего создать и кнопками сначала запускать функцию, которая останавливает все аудио на странице. В JS-код добавьте:
function all_pause(){
	var all_audio = document.getElementsByTagName("audio");
	for(i = 0; i < all_audio.length; i ++) all_audio[i].pause;
}

а 4, 22, 23, 24 строки переписать так:
<button  href="#one" class="button primary scrolly" onclick="all_pause(); document.getElementById('audio').play()">Начать</button>
<button  href="#two" class="goto-next scrolly" onclick="all_pause(); document.getElementById('audio2').play()">Next</button>
<button  href="#three" class="goto-next scrolly" onclick="all_pause(); document.getElementById('audio3').play()">Next</button>
<button  href="#four" class="goto-next scrolly" onclick="all_pause(); document.getElementById('audio4').play()">Next</button>


Часовой пояс GMT +3, время: 19:18.