隨機播放聲音重疊

Question

嘿，我需要您的幫助。 我已經為隨機聲音腳本進行了所有設置並完美工作。 問題是我將其設置為當我將鼠標懸停在圖片上時會播放隨機聲音（這就是我想要的）。 但是，每當我將鼠標懸停在圖片上時，它都會發出另一種聲音，然后在仍然播放另一種聲音時再次將鼠標懸停在該聲音上。 我最終想用更長的聲音來做到這一點，但是聲音彼此疊加會變得一團糟。 有沒有一種設置方法，使其一次只能播放一個（隨機選擇），或者直到播放文件完成才開始播放。 有什么可以防止這種情況？？？

這是代碼：

    $(document).ready(function(){
        $('audio').each(function(){
            this.volume = 0.4;
        });
        $(".ladyleepic img").mouseover(function(){
            var n = Math.ceil(Math.random() * 5);
            $("#audio"+n).trigger('play');
        });

    });

我應該添加我在Dreamweaver CS6中使用JQuery和音頻標簽。 （音頻1,2,3等）

<audio id="audio1"

  <source src=".mp3"></source>
  <source src=".ogg"></source>

</音頻

謝謝BigMarkess

Answer 1

您需要將一個事件綁定到聲音播放完畢時：

如何判斷HTML5音頻元素何時播放完畢？

您可以添加一個由該事件設置的標志。

$(document).ready(function(){
    $('audio').each(function(){
        this.volume = 0.4;
    });
    var playing = false;
    $("audio").bind('ended', function(){
        playing = false;
    });

    $(".ladyleepic img").mouseover(function(){
        if (!playing) {
            var n = Math.ceil(Math.random() * 5);
            $("#audio"+n).trigger('play');
            playing = true;
        }
    });
});