复制粘贴在函数中的Javascript代码,不会被调用。否则它确实如此。这里的逻辑是什么?

时间:2014-03-14 18:33:01

标签: javascript jquery

以下是通过调用函数来加载图表而编写的代码:

//Capture customer and measures values in an array
$("document").ready(function(){
$("button").click(function(){
    Load_PieTest();
    var custArray = new Array();
    var measureArray = new Array();
    var formElements = new Array();
    $("#custSelect >option:selected").each(function(i){
        custArray[i]=$(this).val();
    });
    //alert(custArray);
    $("#measureSelect >option:selected").each(function(j){
        measureArray[j]=$(this).val();
    });
    //alert(measureArray);

    //Convert into suitable JSON
    var length = Math.max(custArray.length, measureArray.length);
    var k;
    for(k=0;k<length;k++){
        //alert("Inside for loop")
        if(typeof(custArray[k])=="undefined"){
            //alert("Undefined customer");
            custArray[k]==null;
        }else if(typeof(measureArray[k])=="undefined"){
            //alert("Undefined measure");
            measureArray[k]==null;
        }
        //alert("About to push into array");
        formElements.push({"customer":custArray[k],"measure":measureArray[k]});

    }
    //alert("outside loop");
    //alert(formElements[0].customer);
    var chartSelect = document.getElementById("typeOfChart");
    var chartOption = chartSelect.options[chartSelect.selectedIndex].value;
    alert(chartOption);

    //Call appropriate AMCharts javascripts
    LoadCharts(chartOption,formElements);
    });
});

LoadCharts是一个基于所选选项加载图表的功能。假设选择了PieChart。应使用AMCharts库

弹出饼图

编写用于在脚本标记之间创建图表的代码时,它可以正常工作。但是如果写入一个被调用的函数,内部自定义方法AmCharts.ready()就不会被调用。以下是我的代码:

function Load_PieTest(){
var chart;
var legend;
var chartData = [{
    country: "Czech Republic",
    litres: 301.90
}, {
    country: "Ireland",
    litres: 201.10
}, {
    country: "Germany",
    litres: 165.80
}, {
    country: "Australia",
    litres: 139.90
}, {
    country: "Austria",
    litres: 128.30
}, {
    country: "UK",
    litres: 99.00
}, {
    country: "Belgium",
    litres: 60.00
}];

alert("yupp");
AmCharts.ready(function () {
    // PIE CHART
    alert("No");
    chart = new AmCharts.AmPieChart();
    chart.dataProvider = chartData;
    chart.titleField = "country";
    chart.valueField = "litres";
    chart.outlineColor = "#FFFFFF";
    chart.outlineAlpha = 0.8;
    chart.outlineThickness = 2;

    // WRITE
    chart.write("chartdiv");
});
}

</script>
在脚本标记中的函数外部写入时,同样的事情。工作正常。请告诉我为什么会这样?

2 个答案:

答案 0 :(得分:1)

你的问题的答案是AmCharts.ready等到window.onload事件发生后才执行你的功能。在上面的示例中,它不起作用,因为window.onload事件在您调用AmCharts.ready之前已经触发了。所以AmCharts.ready只是无限期地等待。

完全删除AmCharts.ready并直接执行功能代码。像这样:

}, {
    country: "Belgium",
    litres: 60.00
}];

alert("yupp");
// PIE CHART
alert("No");
chart = new AmCharts.AmPieChart();
chart.dataProvider = chartData;
chart.titleField = "country";
chart.valueField = "litres";
chart.outlineColor = "#FFFFFF";
chart.outlineAlpha = 0.8;
chart.outlineThickness = 2;

// WRITE
chart.write("chartdiv");

}

答案 1 :(得分:0)

也许在你调用函数之前,触发AmCharts.ready()的事件已经触发了?这有用吗:

function Load_PieTest(){
    var chart;
    var legend;
    var chartData = [{
        country: "Czech Republic",
        litres: 301.90
    }, {
        country: "Ireland",
        litres: 201.10
    }, {
        country: "Germany",
        litres: 165.80
    }, {
        country: "Australia",
        litres: 139.90
    }, {
        country: "Austria",
        litres: 128.30
    }, {
        country: "UK",
        litres: 99.00
    }, {
        country: "Belgium",
        litres: 60.00
    }];

    //alert("yupp");

    // PIE CHART
    //alert("No");
    chart = new AmCharts.AmPieChart();
    chart.dataProvider = chartData;
    chart.titleField = "country";
    chart.valueField = "litres";
    chart.outlineColor = "#FFFFFF";
    chart.outlineAlpha = 0.8;
    chart.outlineThickness = 2;

        // WRITE
    chart.write("chartdiv");
}

AmCharts.ready(function () {
    Load_PieTest();
})

我将准备好移到外面,调用该功能。