Использование JavaScript для управления воспроизведением mp3 в HTML

Я пытаюсь контролировать mp3 через события щелчка.Использование JavaScript для управления воспроизведением mp3 в HTML

<!DOCTYPE html> 
<html> 
<body> 

<audio id="demo" autoplay="true" hidden="hidden"> 
    <source src="Lute.mp3" type="audio/mpeg"> 
    Your browser does not support the audio element. 
</audio> 

<div onmousedown="WhichButton(event)"> 
    <img src="Birch-Forest.jpg" alt="A birch forest in the fall" 
    style="width:600px;height:572px"> 
</div> 

<script> 
var playing = false; 
function WhichButton(event) { 
    if (event.button == 0) { 
    document.getElementById('demo').volume-=0.1; 
    } 
    else if (event.button == 1 && playing) { 
    document.getElementById('demo').pause; 
    } 
    else if (event.button == 1 && !playing) { 
    document.getElementById('demo').play; 
    } 
    else if (event.button == 2) { 
    document.getElementById('demo').volume+=0.1; 
    } 
} 
</script> 

</body> 
</html>

Этот код загружает изображение и запускает воспроизведение звука, но элементы управления не работают. Я не знаю, что я делаю, просто новичок в HTML и JavaScript.

источник

2015-03-14 Lupilum

У вас есть какая-то ошибка в вашем сценарии ... давайте посмотрим:

Вы инициализировать переменную playing, как ложной, но ваш аудиоплеер имеет множество автовоспроизведения правды ... так, может быть, просто для ясности , ваша переменная должна быть инициализирована до true или переименована в pausing. Однако это не ошибка :)
pause и play являются функциями вашего аудиоплеер, так что если вы хотите вызвать их, вы должны использовать скобки, как это: document.getElementById('demo').pause();. И наоборот volume является недвижимость, поэтому вам не нужны скобки.
Теперь вы хотите воспроизвести звук, когда он приостановлен, и приостановить его, когда он играет. Правильно у вас есть логическая переменная для этого (игры), но вы никогда не меняете ее значение!

Ваш код с некоторыми исправлениями:

<script> 
var playing = true; // Point 1 
var audioPlayer = document.getElementById('demo'); 
function WhichButton(event) {  
    if (event.button == 0 && audioPlayer.volume > 0) { 
     audioPlayer.volume-=0.1; 
    } 
    else if (event.button == 1 && playing) { 
     audioPlayer.pause(); // Point 2 
     playing = false; // Point 3 
    } 
    else if (event.button == 1 && !playing) { 
     audioPlayer.play(); 
     playing = true; 
    } 
    else if (event.button == 2 && audioPlayer.volume < 1) { 
     audioPlayer.volume+=0.1; 
    } 
} 
</script>

источник

2015-03-14 16:33:06

Это было очень полезно! Спасибо! Хотя правый щелчок не работает, но я выбрал эту кнопку. :) – Lupilum

Использование JavaScript для управления воспроизведением mp3 в HTML

ответ

Смежные вопросы