javascript - 自定义 jQuery 函数随机未定义

Question

预先感谢您的帮助。

我有一个页面可以呈现一些图表，但我似乎只是偶尔遇到范围问题。

我制作了一系列 jQuery 函数，用于根据传入的选项呈现特定类型的图表，每个函数都包含一个 AJAX 调用，用于根据调用图表上的图表函数时提交的选项来请求正确的数据集容器。

一些图表与第二个图表配对，其选项由第一个图表 AJAX 调用响应的 JSON 响应确定。触发 AJAX success: 后，配对图表将在第一个图表的回调中呈现。

大多数时候，这工作得很好，但偶尔我会收到错误“TypeError: $(...).lineChart is not a function”。第一个 barChart 每次都会呈现，但偶尔会无法再访问与 barChart 相同的文件中定义的 lineChart 函数。

我添加到代码中的任何延迟似乎都可以解决问题。当我使用调试器时，这个问题不存在，我可以捕获错误并在超时后重新调用 lineChart 函数，这似乎也有效。

我不知道为什么该功能有时不再可用以及似乎是随机的。

对于没有粘贴确切的代码，我深表歉意。有相当多的评论和变量/函数名称我无法在这里发布。

谢谢。

$.fn.barChart = function (options, callback) {
    $.ajax(options["url"], {
        method: "POST",
        type: "json",
        data: options.data,
        success: function (response) {

            // ..render this chart ..

            var optionsForNewChart = {}; // ..generate new options to respond with base on response JSON
            callback(optionsForNewChart);
        }
    });
};

$.fn.lineChart = function (options) {
    $.ajax(options["url"], {
        method: "POST",
        type: "json",
        data: options.data,
        success: function (response) {
            // ..render this chart ..
        }
    });
}


$("#barChart1").barChart({
    url: "https://...",
    data: {
        //post data
    }
}, function (response) {
    $('#lineChart1').lineChart(response);
});

$("#barChart2").barChart({
    url: "https://...",
    data: {
        //post data
    }
}, function (response) {
    $('#lineChart2').lineChart(response);
});

$("#barChart3").barChart({
    url: "https://...",
    data: {
        //post data
    }
}, function (response) {
    $('#lineChart3').lineChart(response);
});

Answer 1

将您的代码括在: $(文档).ready(函数(){ //这里是你的代码 }); 这将解决函数未加载的问题。