javascript - 单击事件不会在 highcharts 工具提示中触发

Question

我正在使用 Highchart 库。我通过格式化程序函数回调创建了一个工具提示，并在工具提示中插入了一个链接。

 config.tooltip.formatter = function(){
                    //console.log(this)
                    var tooltipHTML = "<b>✔ " + this.y + "% - " + this.key + "</b>";
                    var userImg = $('.user-picture').html();
                    if (userImg) {
                        tooltipHTML += "<div class='user-avatar-comment'>";
                        tooltipHTML += userImg;
                        tooltipHTML += "</div>";
                    }
                    tooltipHTML += "<div class='comment_filter'><a class='comments_buble' href='#' data-series='" + this.point.index + "'>Comment</a></div>";

                    return tooltipHTML;
                }

现在我想在点击时调用 ajax 但点击事件没有触发。

jQuery('.comments_buble').on('click', function(e) {
//ajax call here
})

这是代码

http://jsfiddle.net/vxnq3578/3/

Answer 1

工具提示在页面加载后动态附加到 DOM，因此您需要使用委托(delegate)事件处理程序:

$(document).on('click', '.comments_buble', function(e) {
    // ajax call here
})