Mail.ruПочта0Мой Мир0ОдноклассникиВКонтактеИгры0ЗнакомстваНовостиКалендарьОблакоЗаметкиВсе проекты

Помогите с html js

Никита Люткин Ученик (156), на голосовании 2 дня назад
<audio src="aud.mp3" preload="auto">
</audio>
<script>
let audio = document.querySelector('audio');
audio.volume = 1.0;
audio.play();
</script>
Код не работает. Что не так? Когда ставлю controls по кнопке воспроизводится
Голосование за лучший ответ
_ Искусственный Интеллект (873628) 1 месяц назад
код не работает, потому что современные браузеры блокируют автоматическое воспроизведение аудио без взаимодействия пользователя.

Можешь попробовать переписать скрипт:

 <audio id="myAudio" src="aud.mp3" preload="auto"></audio> 
<button id="playButton">Воспроизвести</button>

<script>
let audio = document.getElementById('myAudio');
let playButton = document.getElementById('playButton');

playButton.addEventListener('click', function() {
audio.volume = 1.0;
audio.play();
});
</script>
Андрей Высший разум (480417) 1 месяц назад
И не будет работать. Во всех современных браузерах автоматический запуск аудиофайлов в <audio> и видеофайлов со звуком в <video> запрещён. Воспроизведение начнётся только после того, как посетитель явно нажмёт на play.

После появления этих тегов развелось слишком много хитрожопых рекламщиков, врубавших в баннерах звук на полную громкость в любое время дня и ночи. Так что пришлось принимать меры.
S.H.I. Оракул (73212) 1 месяц назад
Полное автовоспроизведение со звуком без взаимодействия пользователя сложно реализовать, так как это защитный механизм браузеров. Но вот несколько хитрых подходов:
 <audio id="myAudio" src="aud.mp3" preload="auto"></audio> 
<script>
// Вариант 1: Попытка воспроизведения при различных событиях
document.addEventListener('DOMContentLoaded', tryPlay);
document.addEventListener('click', tryPlay, {once: true});
document.addEventListener('keydown', tryPlay, {once: true});
document.addEventListener('mousemove', tryPlay, {once: true});
document.addEventListener('scroll', tryPlay, {once: true});

function tryPlay() {
let audio = document.getElementById('myAudio');
audio.volume = 1.0;
let playPromise = audio.play();

if (playPromise !== undefined) {
playPromise.catch(error => {
console.log("Автовоспроизведение не разрешено: ", error);
});
}
}

// Вариант 2: Начать с muted, затем попытаться включить звук
setTimeout(() => {
let audio = document.getElementById('myAudio');
audio.muted = true;
audio.play().then(() => {
// Попытка включить звук через секунду
setTimeout(() => {
audio.muted = false;
}, 1000);
});
}, 500);
</script>
Похожие вопросы