尝试抽象WebAudio API xhr请求的部分时,无法将DOM元素传递给Javascript中的构造函数 [英] Can't pass a DOM element to a constructor function in Javascript when trying to abstract section of WebAudio API xhr request

查看:69
本文介绍了尝试抽象WebAudio API xhr请求的部分时,无法将DOM元素传递给Javascript中的构造函数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的问题是这个。当我在下面的 audioBoing函数中添加参数,然后将相同的参数放在 getElementById 字符串中时,该功能无法正常工作。我收到一条错误消息,指出未捕获的类型错误,无法调用方法'AddEventListener'为null

My problem is this. When I add an argument to the audioBoing function below and then place the same argument in the getElementById string, the function doesn't work. I get an error that says uncaught type error, cannot call method 'AddEventListener' of null

下面的函数可以正常工作。我重新编写了下面的函数,以反映我要执行的操作。最终,我试图对函数的大部分进行抽象,以便我可以插入参数并运行它,而不必每次存储/启动声音时都对其进行重写。

The function below works fine. I rewrote the function below it to reflect what I'm trying to do. Ultimately I am trying to abstract a good portion of the function so I can just plug in arguments and run it without having to rewrite it each time for each sound it stores / launches.

var playAudioFileOneDrumOneBig = function () {
var source = context.createBufferSource();
source.buffer = savedBufferOne;
source.connect(delay.input);
delay.connect(convolver.input);
convolver.connect(context.destination);
source.noteOn(0); // Play sound immediately
};




function audioBoing()  
var xhr = new XMLHttpRequest();
xhr.open('get', 'audio/F.mp3', true);
xhr.responseType = 'arraybuffer';
xhr.onload = function () {
        context.decodeAudioData(xhr.response,
             function(incomingBuffer1) {
                 savedBufferOne = incomingBuffer1;
                 var noteOneDrumOneBig = document.getElementById("noteOneDrumOneBig"); 
                 noteOneDrumOneBig.addEventListener("click", playAudioFileOneDrumOneBig , false);
             }
        );
};
xhr.send();
};

audioBoing();

已改写无效

function audioBoing(yay) {      //added yay

this.yay=yay;                 // defined yay

var xhr = new XMLHttpRequest(); 
xhr.open('get', 'audio/F.mp3', true);
xhr.responseType = 'arraybuffer';
xhr.onload = function () {
        context.decodeAudioData(xhr.response,
             function(incomingBuffer1) {                  
                 savedBufferOne = incomingBuffer1;    
                 var noteOneDrumOneBig = document.getElementById(yay);           //passed yay
                 noteOneDrumOneBig.addEventListener("click", playAudioFileOneDrumOneBig , false);   //error happens here
             }
        );
};
xhr.send();
};

audioBoing(noteOneDrumOneBig);


推荐答案

您没有引用传递给 audioBoing

audioBoing("noteOneDrumOneBig");

这篇关于尝试抽象WebAudio API xhr请求的部分时,无法将DOM元素传递给Javascript中的构造函数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆