这个错误是什么意思？当我下载到highcharts，pdf，image中的任何格式时都会发生。有没有人遇到过这个？
Unhandled exception at line 41, column 33
in http://localhost/scripts/customEvents.js
0x800a138f - JavaScript runtime error: Unable to get property 'on'
of undefined or null reference
这是我的脚本
<%--ADD high chart css and js here.--%>
<script type="text/javascript" src="scripts/highcharts.js"></script>
<script type="text/javascript" src="scripts/exporting.js"></script>
<script type="text/javascript" src="scripts/data.js"></script>
<script type="text/javascript" src="scripts/customEvents.js"></script>
<link rel="stylesheet" type="text/css" href="css/iestyle.css">
我尝试了不同的导出方式，但一切都指向相同的错误。我该如何解决这个问题 ？
答案 0 :(得分：1)
回到我最基本的代码和高级图表中的演示后，结果发现了点击事件，以便下载＆＃39;按钮在customEvents.js中触发而不是exports.js。删除对customEvents.js的引用后，下载按钮再次起作用。但是这不是解决方案，因为我还需要用于鼠标悬停的customEvents，因此，这是highcharts customEvents插件的错误。
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/data.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<script src="http://blacklabel.github.io/custom_events/customEvents.js"></script>
<script type="text/javascript">
$(function () {
var categoryImgs = {
'Banana': '<img src="/images/2.png"><img> ',
'Orange': '<img src="/images/8.png"><img> ',
'Fruit': '<img src="/images/12.png"><img> ',
'Apple': '<img src="/images/4.png"><img> ',
'Coconut': '<img src="/images/3.png"><img> '
};
var totals = new Array();
var stackTotals = new Array();
var i = 5, j = 0;
//totals = HighchartsAdapter
function reverse() {
totals.reverse();
}
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Premium Summary'
},
xAxis: {
categories: ['Banana', 'Fruit', 'Orange', 'Apple', 'Coconut'],
labels: {
x: 5,
useHTML: true,
formatter: function () {
var n = totals.shift();
return '<div class="stacktotal">$' + n + '</div><div id="div1" class="myToolTip' + this.value + '">' + categoryImgs[this.value] + '</div>';
},
events: {
mouseover: function (e) {
var elm = e.currentTarget.children.div1.className;
switch (elm) {
case "myToolTipBanana":
document.getElementById('hoverboard').style.display = "block";
$('#hoverboard').html('<img style="padding-left:7px; padding-bottom: 30px" src="/images/2.png"><img> <div class="desc">39 year old female non smoker - Occupation Class 1</div><table>' +
'<tr><td><b>Jam</b><span id="italics"> (2 Week wait)</td><td>$80,000</td><td class="pad">$89</td></tr>' +
'<tr><td><b>Fruit</b><span id="italics"> (2 Week wait)</td><td>-</td><td class="pad">$150</td></tr>' +
'<tr><td><b>Candy</b></td><td>Nil Excess</td><td class="pad">$150</td></tr>' +
'<tr><td colspan="3" class="pad" ><hr /></td></tr><tr><td><span id="policy">Boxes</span></td><td></td><td class="pad">$200.12</td></tr>' +
'<tr bgcolor="#EDF7F7"><td style="font-size:14px;"><b>Total Premium (Monthly)</b></td><td></td><td class="pad"><b>$514.55<b></td></tr>' + '</table>');
break;
case "myToolTipFruit":
document.getElementById('hoverboard').style.display = "block";
$('#hoverboard').html('<img style="padding-left:7px; padding-bottom: 30px" src="/images/8.png"><img> <div class="desc">39 year old female non smoker - Occupation Class 1</div><table>' +
'<tr><td><b>Jam</b><span id="italics"> (2 Week wait)</td><td>$80,000</td><td class="pad">$400</td></tr>' +
'<tr><td><b>Fruit</b><span id="italics"> (2 Week wait)</td><td>-</td><td class="pad">$186.76</td></tr>' +
'<tr><td><b>Candy</b></td><td>Nil Excess</td><td class="pad">$210.23</td></tr>' +
'<tr><td colspan="3" class="pad" ><hr /></td></tr><tr><td><span id="policy">Boxes</span></td><td></td><td class="pad">$290</td></tr>' +
'<tr bgcolor="#EDF7F7"><td style="font-size:14px;"><b>Total Premium (Monthly)</b></td><td></td><td class="pad"><b>$1086.99<b></td></tr>' + '</table>');
break;
case "myToolTipOrange":
document.getElementById('hoverboard').style.display = "block";
$('#hoverboard').html('<img style="padding-left:7px; padding-bottom: 30px" src="/images/12.png"><img> <div class="desc">39 year old female non smoker - Occupation Class 1</div><table>' +
'<tr><td><b>Jam</b><span id="italics"> (2 Week wait)</td><td>$80,000</td><td class="pad">$258.13</td></tr>' +
'<tr><td><b>Fruit</b><span id="italics"> (2 Week wait)</td><td>-</td><td class="pad">$150</td></tr>' +
'<tr><td><b>Candy</b></td><td>Nil Excess</td><td class="pad">$143.50</td></tr>' +
'<tr><td colspan="3" class="pad" ><hr /></td></tr><tr><td><span id="policy">Boxes</span></td><td></td><td class="pad">$45.78</td></tr>' +
'<tr bgcolor="#EDF7F7"><td style="font-size:14px;"><b>Total Premium (Monthly)</b></td><td></td><td class="pad"><b>$597.41<b></td></tr>' + '</table>');
break;
case "myToolTipApple":
document.getElementById('hoverboard').style.display = "block";
$('#hoverboard').html('<img style="padding-left:7px; padding-bottom: 30px" src="/images/3.png"><img> <div class="desc">39 year old female non smoker - Occupation Class 1</div><table>' +
'<tr><td><b>Jam</b><span id="italics"> (2 Week wait)</td><td>$80,000</td><td class="pad">$212</td></tr>' +
'<tr><td><b>Fruit</b><span id="italics"> (2 Week wait)</td><td>-</td><td class="pad">$200</td></tr>' +
'<tr><td><b>Candy</b></td><td>Nil Excess</td><td class="pad">$219</td></tr>' +
'<tr><td colspan="3" class="pad" ><hr /></td></tr><tr><td><span id="policy">Boxes</span></td><td></td><td class="pad">$71</td></tr>' +
'<tr bgcolor="#EDF7F7"><td style="font-size:14px;"><b>Total Premium (Monthly)</b></td><td></td><td class="pad"><b>$702<b></td></tr>' + '</table>');
break;
case "myToolTipCoconut":
document.getElementById('hoverboard').style.display = "block";
$('#hoverboard').html('<img style="padding-left:7px; padding-bottom: 30px" src="/images/4.png"><img> <div class="desc">39 year old female non smoker - Occupation Class 1</div><table>' +
'<tr><td><b>Jam</b><span id="italics"> (2 Week wait)</td><td>$80,000</td><td class="pad">$152</td></tr>' +
'<tr><td><b>Fruit</b><span id="italics"> (2 Week wait)</td><td>-</td><td class="pad">$100</td></tr>' +
'<tr><td><b>Candy</b></td><td>Nil Excess</td><td class="pad">$143</td></tr>' +
'<tr><td colspan="3" class="pad" ><hr /></td></tr><tr><td><span id="policy">Boxes</span></td><td></td><td class="pad">$120</td></tr>' +
'<tr bgcolor="#EDF7F7"><td style="font-size:14px;"><b>Total Premium (Monthly)</b></td><td></td><td class="pad"><b>$515<b></td></tr>' + '</table>');
break;
}
},
mouseout: function () {
document.getElementById('hoverboard').style.display = "none";
$('#hoverboard').html('');
}
},
}
},
linkedTo: 0,
categories: ['Banana', 'Fruit', 'Orange', 'Apple', 'Coconut'],
yAxis: {
min: 0,
title: {
text: ''
},
labels: {
formatter: function () {
return '$' + this.value;
}
},
stackLabels: {
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'black',
},
formatter: function () {
totals[i++] = this.total;
return '';
},
}
},
legend: {
align: 'right',
x: -70,
verticalAlign: 'top',
y: 20,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
formatter: function () {
return this.series.name + ', ' + this.x + ', ' +' $'+ this.y + '<br/>';
}
},
plotOptions: {
column: {
stacking: 'normal',
borderWidth:0,
dataLabels: {
enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'black',
style: {
textShadow: '0 0 3px black, 0 0 3px black'
},
format: '${y}'
}
}
},
series: [{
name: 'Jam',
y:'$' + this.value,
data: [200.12, 290, 45.78, 71, 120],
color: '#B9B6BA',
}, {
name: 'Fruit',
data: [150, 186.76, 150, 200, 100],
color: '#E5764C'
}, {
name: 'Candy',
data: [89,400, null , 212, 152],
color: '#9D8365'
}, {
name: 'Boxes',
data: [75.43, 210.23, 143.50, 219, 143],
color: '#9F7AC3'
} ]
});
});
</script>