javascript - 从 js/jquery 中的对象数组播放音频文件

Question

我正在制作一个对象来围绕 html5 音频元素的实例包装控件。为了测试，我制作了一个像这样的对象(为便于阅读而简化)..

function AudioObject(audio) {
    var innerAudio = audio;

    this.Play = function () {
        innerAudio.play()
    }
}

我有一个包含这个 AudioObject 实例的数组。

var AudioObjects = [];

然后，在创建新的 AudioObjects 时，我将它们添加到数组中。我有一个函数可以延迟播放 AudioObjects，以便它们按顺序播放。像这样的东西:

var audioObj = new AudioObject(audio);
AudioObjects.push(audioObj);
....
....
var delay = 0;
$.each(AudioObjects, function(iterator, obj) {
    setTimeout(obj.Play, delay);
    delay = delay + 3000;
}

当只有一个音频文件时，它可以正常播放，但是一旦我添加了更多 AudioObjects，数组中的每个文件都会将它们的 innerAudio 变量设置为最新创建的 Audio 元素。我可以从 html 中单独播放每一个。我在创建时进行了调试，我可以看到它正在设置正确的音频，但是在被推送到数组后，数组中的对象都被切换到了最新的 innerAudio。

我没有正确实例化我的对象吗？我做了 this jsfiddle尝试使用警报文本，它似乎没有我遇到的问题。

更新:我想我找到了我的问题。这就是我认为您在对象内部编写“公共(public)”和“私有(private)”函数的方式。

function Thing(test) {
    var thingTest = test;

    // Public function
    this.PublicTest = function () {
        setTimeout(Test, 1000);
    }

    // Private function
    PrivateTest = function () {
       alert(thingTest);
    }
}

这基本上就是我的代码的结构方式，但是“私有(private)”函数的范围与公共(public)函数的范围不同。我仔细检查了我的数组，它实际上是用正确的音频源保存了正确的音频对象，但是在运行调用“私有(private)”函数的函数时，它调用了错误的音频文件。

我更新了 the jsfiddle显示正在发生的事情。我认为它会提醒“test1”然后是“test2”，但它会提醒“test2”两次。

更新 2:作为记录，将私有(private)函数更改为此解决了问题:

function Play() {   // <<< That's all I had to change!
    innerAudio.play()
}

Answer 1

您是否为每个音频包装器创建唯一的音频对象？

var audio = new Audio();
audio.src = 'src';

var audioObj = new AudioObject(audio);
AudioObjects.push(audioObj);