Question

当JS在HTML文档中的script标记内时，我有一个可以正常运行的高效图，但是如果我转移到外部javascript则会停止加载。我gather我需要一个onLoad处理程序，但我对它所属的位置感到困惑。

这是我的HTML：

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">

  <script type='text/javascript' src='//code.jquery.com/jquery-1.9.1.js'></script>
  <script type='text/javascript' src="//code.highcharts.com/highcharts.js"></script>
  <script type='text/javascript' src="//code.highcharts.com/modules/drilldown.js"></script>
  <script type='text/javascript' src="allspending.js"></script>


</head>
<body>
<div id="allspending" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

</body>
</html>

这是（一个严重愚蠢的版本）“allspending.js”：

var allspending = [
    [2002, 591856],
    [2003, 839446],
    [2004, 848463]
];


$(function () {
    $('#allspendng').highcharts({
        chart: {
            type: 'column',
            renderTo: 'allspending'
        },
        series: [{
           data: allspending, 

        }]
    });
});

Answer 1

不可否认，我没有使用过highchart，但我认为jQuery的准备工作比你想要的要早。我想在allspending.js中定义它：

function init()
{
    $('#allspendng').highcharts({
        chart: {
            type: 'column',
            renderTo: 'allspending'
        },
        series: [{
           data: allspending, 

        }]
    });
}

并从onload事件中调用它，例如通过：

<body onLoad="init()">

会做到这一点。

示例onLoad处理程序？

1 个答案: