Автозапуск аудио не воспроизводится - PullRequest
0 голосов
/ 30 января 2019

Я хочу, чтобы браузер воспроизводил мой файл wolf.mp3 10 раз.После загрузки страницы ничего не происходит.

class Animal {
  constructor(name, audioSrc) {
    this._name = name;
    this._audioSrc = audioSrc;
  }
  makeSound() {
    let audioEl = document.createElement("audio");
    audioEl.src = this._audioSrc;
    audioEl.autoplay = true;
    document.body.appendChild(audioEl);
  }
}
let testyWolf = new Animal("wolf","audio/wolf.mp3" );
for (let i = 0; i < 10; i++) {
  testyWolf.makeSound();
}

Ответы [ 2 ]

0 голосов
/ 30 января 2019

Только один аудиофайл может быть воспроизведен, однако вы можете сделать так, чтобы один файл звучал, как многие.Поэтому я сделал некоторые изменения в вашем коде, и теперь звук будет воспроизводиться, когда вы mouseover тело, хотя это будет выглядеть как автозапуск.смотрите ниже, чтобы понять

class Animal {
  constructor(name, audioSrc) {
    this._name = name;
    this._audioSrc = audioSrc;
    this.audioEl= "";
  }
  
  
  
   play(){
    this.audioEl.play();
   }
  
  makeSound() {
    this.audioEl = document.createElement("audio");
    this.audioEl.src = this._audioSrc;
    this.audioEl.autoplay = false;
    document.body.appendChild(this.audioEl);
    
    return this;
  }
}

var items = [];
for (let i = 0; i < 10; i++) {
  items.push(new Animal("wolf","https://freewavesamples.com/files/Yamaha-V50-Rock-Beat-120bpm.wav" ).makeSound());
}

document.addEventListener('mouseover', e => {
  items.forEach((item)=>
  {
    setTimeout(function(){ item.play()},200);
  });
})
0 голосов
/ 30 января 2019

Из-за политики автозапуска .

Пользователь должен сначала взаимодействовать с документом, т.е. щелкнуть где-нибудь на странице.

class Animal {
  constructor(name, audioSrc) {
    this._name = name;
    this._audioSrc = audioSrc;
  }
  makeSound() {
    let audioEl = document.createElement("audio");
    audioEl.src = this._audioSrc;
    audioEl.autoplay = true;
    document.body.appendChild(audioEl);
  }
}

let testyWolf = new Animal("wolf","https://freewavesamples.com/files/Yamaha-V50-Rock-Beat-120bpm.wav" );

document.addEventListener('click', e => {
  testyWolf.makeSound()
})
<p> Click anywhere </p>

Поместите где-нибудь кнопку с названием "Начать игру" (если это игра), чтобы пользователь сначала нажимал на вашу страницу, прежде чем пытаться автоматически воспроизводить звук.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...