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>

＆LT; / audio

谢谢你， BigMarkess

Answer 1

您需要将事件绑定到声音播放完毕时：

How can I tell when an HTML5 audio element has finished playing?

您可以添加由此事件设置的标记。

$(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;
        }
    });
});

随机播放声音重叠

1 个答案: