The button inside tooltip does’t have any action when clicked, even set onclick event. Here is an example below,
tooltip: { useHTML: true, formatter: function() { return '<div>' + this.point.date + '<br><span>$' + this.y + '</span><br><button onclick="testAlert()">test test test</button></div>'; }, }, function testAlert() { alert('test'); };
Advertisement
Answer
Change pointer events property of the tooltip to 'auto'
.
tooltip: { // pointFormat: '<div>{point.date}<br>{point.air}<br>${point.y}</div><button>test</button>', useHTML: true, formatter: function() { return '<div>'+this.point.date+'<br>'+this.point.air+'<br><span>$'+this.y+'</span><br><a href="http://www.w3schools.com">testtesttest</a></div>'; }, style: { pointerEvents: 'auto' } },