Question

我有一个ExtJs应用程序，可以加载相当多的javascript文件。这导致很多开销，因此我们现在使用Ajax加载javascript文件。

因此，当用户单击一个按钮时，随后使用Ajax加载带有与该按钮关联的功能的javascript文件：

Ext.Ajax.request({
    url:'filePath',
    success:function(response){
        eval(response.responseText);
        functionAssociatedWithButton();//Calling here the function associated with button
    },
    failure:function(){
        return;
    }
});

functionAssociatedWithButton();//Calling here the same function throws an error of function being undefined

问题是这个函数--functionAssociatedWithButton（） - 存在于使用Ajax加载的JS文件中，是可用的，只能在Ajax请求的成功函数中执行。

但是如果我们尝试在脚本的任何其他部分访问此函数，则JS引擎会抛出错误 - 未定义functionAssociatedWithButton（）。

如何在脚本的其余部分中提供使用Ajax加载的JS文件中的这样一个函数？

我尝试使用第4个选项suggested here - 但这也没有解决问题。

任何人都可以对此有所了解。

提前致谢。

PS：完整的脚本写在ExtJS的onReady函数中。另外，考虑到Ajax可能没有被时间函数加载的可能性在其他地方被调用，我已经通过在Ajax完成加载（使用isLoading（）和setTimeOut（））之后调用函数来尝试这种情况，但即使Ajax有完成加载后，该函数只能在Ajax的success函数中被识别，并且在脚本的其他任何地方都无法识别。

Answer 1

这与您创建的函数的范围有关。该功能仅在success功能中可用;你有效地结束了以下场景：

function foo() {
    function bar() {
        window.alert("hello");
    }
}

console.log(typeof foo); // function
console.log(typeof bar); // undefined

您可以拥有一个将函数添加到的全局命名空间对象，例如：

var test = {};

function foo() {
    test.bar = function () {
        window.alert("hello");
    }
}

console.log(typeof foo); // function
foo();
console.log(typeof test.bar); // function

如何在脚本的其他部分使用js文件中的函数（使用Ajax加载）？

1 个答案: