我正在尝试动态加载 highcharts，如下面的代码所示:它无法识别 highcharts 变量。如果我通过静态方式加载 highcharts，它就可以工作。请帮忙。
我正在使用 jquery 版本 4 和 highcharts 最新版本 1.0
<html>
<head>
//loading jquery
<script src="js/libs/jquery-1.4.2.js" type="text/javascript"></script>
<script type="text/javascript">
var chart1;
$(document).ready(function() {
$.getScript('js/libs/highcharts.src.js', function() {
});
chart1 = new Highcharts.Chart({
chart: {
renderTo: 'chart1',
type: 'bar'
},
title: {
text: 'Fruit Consumption'
},
xAxis: {
categories: ['Apples', 'Bananas', 'Oranges']
},
yAxis: {
title: {
text: 'Fruit eaten'
}
},
series: [{
name: 'Jane',
data: [1, 0, 4]
}, {
name: 'John',
data: [5, 7, 3]
}]
});
});
</script>
</head>
<body>
<div id="chart1"></div>
</div>
</body>
</html>
最佳答案
$.getScript() 是一个异步操作，这意味着它会去获取脚本，但不会等它完成后再处理其余代码。因此，您需要等待某种表明已检索代码的指示。如果你看the docs您会注意到 $.getScript() 有一个成功回调函数就是为了这个目的。事实上，您的代码中已经有一个空的成功函数，只需将 Highcharts 声明移到那里即可。换句话说，这样做:
$(document).ready(function() {
$.getScript('js/libs/highcharts.src.js', function() {
chart1 = new Highcharts.Chart({
// Highcharts options
});
});
});
关于javascript - 如何动态加载highcharts，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9108279/