javascript - 如何使用 javascript/jquery 在不同的幻灯片中播放不同的音频？

Question

我正在尝试构建一个类似幻灯片的项目。我正在使用 ferroSlider jquery 插件和 Popcorn.js。我的项目有一些幻灯片，每张(几乎全部)都有音频标签(所有音频标签都不同)。我想在每张幻灯片结束加载时播放音频。 FerroSlider 提供了一个事件“endslie”和一个返回当前 div 的函数 ($.fn.ferroslider.getActualSlideId())。我能够获取当前的音频 ID，但我无法播放它...
任何帮助都将不胜感激。谢谢大家。

$(document).ready(function() {

    $(document).bind("endslide", function(){
          var slideactual=$.fn.ferroSlider.getActualSlideId();
          var audioactual=[];



          $(slideactual).find("audio").each(function(){audioactual.push(this.id);});
          if($(slideactual).children('audio').length>0){
          alert(audioactual);
         }

        });

http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/docs/docs.php

Answer 1

一旦你有了音频元素。您可以使用音频标签的内置功能播放音频。有 onLoad 事件监听器。音频一加载就会播放，您甚至可以添加暂停和播放按钮。

<script>
    $(document).ready(function() {
        var audioElement = $(audioactual);

        audioElement.addEventListener("load", function() {
            audioElement.play();
        }, true);

        $('.play').unbind('click').click(function() {
            audioElement.play();
        });

        $('.pause').unbind('click').click(function() {
            audioElement.pause();
        });
    });
</script>     

将此代码(在准备好的文档中)添加到您的回调函数中，音频应在加载时播放。它会绑定(bind)