score:0

try this, i added tooltipclick class to the span

{
    usehtml: true,
    formatter: function () {
        var s = '<b>' + this.x + '</b>';
        $.each(this.points, function (i, point) {
            s += '<br/><span style="color:' + point.series.color + '">\u25cf</span>\n\ <span class="tooltipclick">click me</span> ' + point.series.name + ': ' + point.y;
        });
        return s;
    },
    shared: true
}

and delegated an event handler

$(document).on('click','.tooltipclick',function(){
      console.log($(this).parent()); //get the tooltip
      alert('a toolip was clicked')
});

score:2

i got the answer on my query from highcharts

tooltip: {
usehtml: true,
formatter: function () {
    var s = '<b>' + this.x + '</b>';
    $.each(this.points, function (i, point) {
        s += '<br/><span style="color:' + point.series.color + '">\u25cf</span>\n\ <span onclick="my_function();">click me</span> ' + point.series.name + ': ' + point.y;
    });
    return s;
},
shared: true

}

i am doing a spelling mistake by using usehtml but it is actually usehtml. so now my problem is solved.


Related Query

More Query from same tag