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试验了警报文本，但它似乎没有遇到我遇到的问题。

更新：我想我发现了自己的问题。这就是我认为你在对象中写一个“公共”和“私有”函数的方式。

function Thing(test) {
    var thingTest = test;

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

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

这实际上是我的代码的结构，但“私有”函数的范围与公共代码不同。我仔细检查了我的数组，它实际上是用正确的音频源保存了正确的audioObject，但是当运行调用“私有”函数的函数时，它会调用错误的音频文件。

我已更新the jsfiddle以显示正在发生的事情。我认为它会警告“test1”然后“test2”，但它会两次警告“test2”。

更新2：对于记录，将私有函数更改为此修复了问题：

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

Answer 1

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

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

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

在js / jquery中播放对象数组中的音频文件

1 个答案: