Каким методом можно остановить аудиодорожку

Вопрос-ответ JavaScript
1

Добрый всем.
Собрал из интернета во такой код:

video id="myVideo" width="320" height="176" controls
 source src="mov_bbb.m4a" type="video/mp4"
 source src="mov_bbb.ogg" type="video/ogg"
Your browser does not support HTML5 video.
/video

    <script>
    var vid = document.getElementById('myVideo');
    vid.currentTime = 20; // Seek to 20 seconds
    </script>

В данном случае аудио файл начинает проигрываться с 20-ой секунды.
Как указать, например что закончится должно на 30 секунде, когда файл допустим имеет минуту времени?
Т.е. либо задать временные рамки от и до, либо сбрасывать на начало при достижении 30-ой секунды, ну и крайний вариант остановить автоматически дальнейшее проигрывание.
Необходимо дать возможность прослушать лишь часть файла, и не всегда это нужно сначала, почти всегда в основном нужно задавать параметр от которого начинать проигрывать, в прочем как приведено выше этого я добился :)
А вот как остановить дальнейшее прослушивание?
Буду благодарен за помощь!

2

В коде убрал угловые скобки так как его попросту не было видно :)

3

https://metanit.com/web/html5/7.3.php

1 лайк
4

Нечто такое:

vid.addEventListener('timeupdate', function () {
	if (vid.currentTime > 30) {
		vid.pause()
		vid.currentTime = 20
	}
})

Код не проверял на рабочесть

5

Строго говоря, как мне кажется, правильным решением будет обрезать видео до нужной длины. Но если прям никак, тогда как Дмитрий указал.

1 лайк
6

Я сделал так:

var vid = document.getElementById('myAudio');
var vidin = 15;
var vidout = 20;
vid.currentTime = vidin;
let audio = document.querySelector('#myAudio');
 
audio.addEventListener('timeupdate', function() {
    if (audio.currentTime < vidin)
        audio.currentTime = vidin;
    if (audio.currentTime >= vidout) {
        audio.currentTime = vidout;
        audio.pause();
		vid.currentTime = vidin;
    }
});

Вроде багов не заметил, но не хочет работать в Edge (Internet Explorer) - проигрывает от начала и до конца, дает возможность перемотать…
Может нужно для этого браузера дописать специальную под нее строку, или в чем может быть проблема?
Вот пример того, что получилось: https://faq.group/test.html

7

Во всех остальных браузерах, а также на смартфонов гелакси работает, яблоко правда не проверял так как не имею возможности.
Если кому не сложно проверьте у кого Apple по ссылке выше и отпишите пожалуйста.
Спасибо.

8

В ИЕ нужно дебажить чтобы понять что именно не работает. Может обработчик не навешивается, может currentTime не работает. Итд.

По коду: var vid = document.getElementById('myAudio'); и let audio = document.querySelector('#myAudio'); избыточны. Одну нужно убрать и заменить второй. Я бы оставил document.getElementById('myAudio').

9

я закомментировал строку, но увы перестал срабатывать currentTime при перемещении ползунка и можно его двигать и прослушивать всё…

Касательно Edge - в консоли нет ни ошибок, ни предупреждений.

10

и изменил все использования audio?

Ошибки-предупреждения часто не являются сильным сигналом что код не работает. Код, может, например не запускаться. Или, к примеру, значения свойств записываются, но ожидаемые эффекты не проявляются (типа перемотки). Поэтому дебажить нужно пошагово: проверить выполняется ли код, проверить устаналиваются ли свойства и проверить проявляются ли эффекты установки свойств.