Как выполнить alert() в последнюю очередь?

202
19 октября 2018, 04:30

Есть вот такая функция, при её выполнении сначала выводится модальное окно, и только потом воспроизводиться аудио. Нужно, чтоб сначала воспроизводилось аудио, а потом выводилось модальное окно. Как это осуществить? И почему порядок выполнения не сходится с последовательностью в коде?

function result(){ 
	if(total>0){ 
	$('#audio').get(0).play(); 
	alert('Новых заказов:'+total); 
    } 
 }   

Answer 1

Вероятно, play() не является атомарной функцией: внутри происходит асинхронная предзагрузка необходимого для старта файла фрагмента, а затем уже происходит запуск. Вызывая alert() вы останавливаете поток выполнения, тем самым не давая запуститься аудио.

Выход: отслеживать события audio, например, playing, и уже в обработчике события показывать alert().

$(function() { 
  $('#audio').on('playing', function() { 
    alert('test'); 
  }); 
  $('#audio').get(0).play(); 
});
<audio id="audio"> 
  <source src="https://www.sample-videos.com/audio/mp3/crowd-cheering.mp3" type="audio/mpeg"> 
</audio> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

Отслеживать события audio. Показать alert() в обработчике события ended.

$(function() { 
$('#audio').get(0).play(); 
  $('#audio').on('ended', function() { 
    alert('test'); 
  }); 
});

READ ALSO
Как сделать заполнение border кнопки slick слайдера при клике?

Как сделать заполнение border кнопки slick слайдера при клике?

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

242
Ошибка в JavaScript+Jquery.js

Ошибка в JavaScript+Jquery.js

Как исправить подобную ошибку?

193
Значения в динамическую таблицу js

Значения в динамическую таблицу js

Есть таблица динамическая по нажатию добавляются поляПервое поле сделано autocomplete после выбора все остальные поля заполняются

273
Динамическое размещение текста в тег в HTML

Динамическое размещение текста в тег в HTML

Как динамически после клика на кнопку разместить определенный текст на странице в браузере, чтобы потом опять можно кликнуть на кнопку, и текст...

294