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

@Scooterok · Регистрация: 13.10.2019

Студворк — интернет-сервис помощи студентам

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

PHP/HTML
1
2
3
4
5
6
7
8
9
10
<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-ой секунды, ну и крайний вариант остановить автоматически дальнейшее проигрывание.
Необходимо дать возможность прослушать лишь часть файла, и не всегда это нужно сначала, почти всегда в основном нужно задавать параметр от которого начинать проигрывать, в прочем как приведено выше этого я добился

А вот как остановить дальнейшее прослушивание?
Буду благодарен за помощь!

@klopp · 13.10.2019, 15:54

можно так

JavaScript
1
2
3
4
5
6
let timerID = setInterval(() => {
        if(vid.currentTime >= 30) {
            vid.pause();
            timerID = null;
        } 
    }, 500);

только непонятно, зачем вы для звука используете <video>

@Scooterok · 13.10.2019, 16:33 **[ТС]**

Сообщение от klopp

только непонятно, зачем вы для звука используете <video>

исправил, спасибо

@Mr_Sergo · 13.10.2019, 18:14

Scooterok, специально для этого есть событие timeupdate https://codepen.io/pen/?editors=1010

HTML5
1
2
3
<audio id="my-audio" width="320" controls>
    <source src="https://wow.zamimg.com/wowsounds/battleforazeroth/MUS_80_Teldrassil_Battle_Intro_01.ogg">
</audio>

JavaScript
1
2
3
4
5
6
7
let audio = document.querySelector('#my-audio');
 
audio.addEventListener('timeupdate', function() {
    if (audio.currentTime >= 30) {
        audio.pause();
    }
});

https://developer.mozilla.org/... date_event

@Scooterok · 13.10.2019, 19:18 **[ТС]**

to Mr_Sergo,
Спасибо, но тут косяк либо браузера либо я что-то не так делаю.
Допустим есть некий файл 27 сек.
Мне нужно разрешить прослушать с 15 сек по 20 сек.
В Вашем примере почему-то удается прослушать с начала, если перемотать...
А в первом примере от klopp после телодвижение с ползунком вообще страницу перегружать понадобилось, так как ничего не происходила после сдвига влево вправо ползунка, кроме как возвращался он на место.
Может я что-то не так делаю, выше ссылка на тест, большая просьба посмотреть и ткнуть

В идеале вообще скрыть ползунок времени, но это скорее не на форум джаваскриптов, а на другой, по HTML5 audio

Добавлено через 13 минут
т.е. проблема в том что когда перемотаешь на начало, оно не перебрасывает на vidin, и даёт прослушать сначала.
Я правда еще в других браузерах не тестировал...

@Mr_Sergo · 13.10.2019, 19:30

Сообщение от Scooterok

Мне нужно разрешить прослушать с 15 сек по 20 сек.

Что должно происходить по достижении 20 сек.? Перемотка обратно на 15 сек. и снова воспроизведение с 15 по 20сек. (циклично)? Или остановка аудио? Или вообще что-то другое?

@Scooterok · 13.10.2019, 19:33 **[ТС]**

Остановка, что и происходит на данный момент, тут проблем нет.
Проблема в том, когда ползунок перематываешь на начало, то можно прослушать сначала, а не с 15 секунды!
Когда при переводе ползунка до 27 секунды он возвращается в исходное положение и не дает прослушать ни 23-26 секунд!

Что добавить, изменить нужно, чтоб перебрасывало ползунок в исходное положение, в данном случае 15 секунд, и когда в право двигаешь и когда влево?

@Mr_Sergo · 13.10.2019, 19:34

кстати ссылка на демку из моего первого сообщения https://codepen.io/Mr_Sergo/pe... itors=1010

@Scooterok · 13.10.2019, 19:37 **[ТС]**

Ну так у меня вроде так!
Вы же можете просмотреть исходный код, по ссылке что я выше писал.
Поправьте меня, если у меня что-то не так?!

@Mr_Sergo · 13.10.2019, 19:48

Scooterok,

Так? https://codepen.io/Mr_Sergo/pe... itors=1010

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
var audio = document.querySelector('#my-audio');
 
audio.addEventListener('seeked', checkAudio);
audio.addEventListener('timeupdate', checkAudio);
 
function checkAudio(){
    if (audio.currentTime < 15)
        audio.currentTime = 15;
    if (audio.currentTime >= 20) {
        audio.currentTime = 15;
        audio.pause();
    }
}

@Scooterok · 13.10.2019, 19:55 **[ТС]**

Спасибо, чуть подправил, но в основном то, что нужно.
Еще раз большое спасибо!

@Mr_Sergo · 13.10.2019, 20:02

Сообщение от Scooterok

Спасибо

Не за что

@Scooterok · 13.10.2019, 21:01 **[ТС]**

Не хотелось бы плодить темы, еще вопрос есть, если аудио файл весит определенное ко-во мб, допустим 2.4, и если я даю прослушивать только часть, есть ли в джаваскрипте по этому же принципу буферизация, чтоб выкачивался не весь файл для прослушивания, а в рамках заданных секунд от и до?
Ткните пальцем плиз в какую сторону копать...

Добавлено через 31 минуту
В Edge кстати почему-то с первой минуты идёт, т.е. игнорирует джаваскрипт...
А в яблоке говорят вообще нет звука, с этим буду еще позже разбираться, так как пока под руками нет яблока.
В самсунге всё ок...
Можно как-то пофиксить, чтоб в Edge (IE) работало корректно?
Может MIME type в .htaccess файл прописать нужно, или в <head>?

Новые блоги и статьи Все статьи Все блоги /
модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .	Система безопасности+живучести для сервера-слоя интернета (сети). Двойная привязка. Hrethgir 08.04.2026 Далее были размышления о системе безопасности. Сообщения с наклонным текстом - мои. А как нам будет можно проверить, что ссылка наша, а не подделана хулиганами, которая выбросит на другую ветку и. . .	Модель ЗдрввоСохранения 7: больше работников, больше ресурсов. anaschu 08.04.2026 работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ
Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики. Hrethgir 07.04.2026 Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .	Горе от ума kumehtar 07.04.2026 Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .	Использование значений реквизитов справочника в документе, с определенными условиями и правами Maks 07.04.2026 1. Контроль срока действия договора Алгоритм из решения ниже реализован на примере нетипового документа "ЗаявкаНаРаботу", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если. . .	Доступность команды формы по условию Maks 07.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: сделать доступной кнопку (команда формы "ЗавершитьСписание") при. . .

@Scooterok 0 / 0 / 0 Регистрация: 13.10.2019 Сообщений: 7
	13.10.2019, 19:18 [ТС]
	to Mr_Sergo, Спасибо, но тут косяк либо браузера либо я что-то не так делаю. Допустим есть некий файл 27 сек. Мне нужно разрешить прослушать с 15 сек по 20 сек. В Вашем примере почему-то удается прослушать с начала, если перемотать... А в первом примере от klopp после телодвижение с ползунком вообще страницу перегружать понадобилось, так как ничего не происходила после сдвига влево вправо ползунка, кроме как возвращался он на место. Может я что-то не так делаю, выше ссылка на тест, большая просьба посмотреть и ткнуть В идеале вообще скрыть ползунок времени, но это скорее не на форум джаваскриптов, а на другой, по HTML5 audio Добавлено через 13 минут т.е. проблема в том что когда перемотаешь на начало, оно не перебрасывает на vidin, и даёт прослушать сначала. Я правда еще в других браузерах не тестировал... 0

@Scooterok 0 / 0 / 0 Регистрация: 13.10.2019 Сообщений: 7
	13.10.2019, 19:33 [ТС]
	Остановка, что и происходит на данный момент, тут проблем нет. Проблема в том, когда ползунок перематываешь на начало, то можно прослушать сначала, а не с 15 секунды! Когда при переводе ползунка до 27 секунды он возвращается в исходное положение и не дает прослушать ни 23-26 секунд! Что добавить, изменить нужно, чтоб перебрасывало ползунок в исходное положение, в данном случае 15 секунд, и когда в право двигаешь и когда влево? 0

@Mr_Sergo 2037 / 1096 / 409 Регистрация: 29.04.2016 Сообщений: 2,625
	13.10.2019, 19:34
	кстати ссылка на демку из моего первого сообщения https://codepen.io/Mr_Sergo/pe... itors=1010 0

@Scooterok 0 / 0 / 0 Регистрация: 13.10.2019 Сообщений: 7
	13.10.2019, 19:37 [ТС]
	Ну так у меня вроде так! Вы же можете просмотреть исходный код, по ссылке что я выше писал. Поправьте меня, если у меня что-то не так?! 0

@Scooterok 0 / 0 / 0 Регистрация: 13.10.2019 Сообщений: 7
	13.10.2019, 19:55 [ТС]
	Спасибо, чуть подправил, но в основном то, что нужно. Еще раз большое спасибо! 0

@Scooterok 0 / 0 / 0 Регистрация: 13.10.2019 Сообщений: 7
	13.10.2019, 21:01 [ТС]
	Не хотелось бы плодить темы, еще вопрос есть, если аудио файл весит определенное ко-во мб, допустим 2.4, и если я даю прослушивать только часть, есть ли в джаваскрипте по этому же принципу буферизация, чтоб выкачивался не весь файл для прослушивания, а в рамках заданных секунд от и до? Ткните пальцем плиз в какую сторону копать... Добавлено через 31 минуту В Edge кстати почему-то с первой минуты идёт, т.е. игнорирует джаваскрипт... А в яблоке говорят вообще нет звука, с этим буду еще позже разбираться, так как пока под руками нет яблока. В самсунге всё ок... Можно как-то пофиксить, чтоб в Edge (IE) работало корректно? Может MIME type в .htaccess файл прописать нужно, или в <head>? 0

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

Решение