bootstrap 工具提示标题中的锚点 link 在点击时不像锚点

Question

我正在使用 bootstrap 工具提示向 SVG 路径添加一些信息。我在工具提示的标题中添加了一个锚点 link，在我单击锚点执行某些操作之前一切正常。它不像锚，也不会引发任何事件。

这是代码：

<g id="B2" class="blockgroup">
   <path id="B2_Block" class="block" d="M195.4,128.9c-28,18.2-51.9,42.2-70.1,70.2l33.3,19.3c14.8-22.6,34-42,56.5-57L195.4,128.9z"/>
   <text id="B2_Text" transform="matrix(1 0 0 1 166.0186 177.8625)" class="text">B2</text>
</g>

$('.blockgroup').tooltip({
            html: true,
            animation: true,
            container:'body',
            trigger: 'click',
            title: function(){
                return '<div class="tooltip-box">' +
                            '<span>Block</span>' +
                            '<h3>' + this.id + '</h3>' +
                            '<a href="#" class="view-seats" data-block-id="' + this.id + '">View Seats</a>' +
                        '</div>';
            }

        });


$('.view-seats').on('click', function(e){
    e.preventDefault();
    console.log('clicked');
});

Answer 1

初始化点击处理程序时 .view-seats 元素尚未添加到 DOM。在显示 tooltp 后，此元素将添加到 DOM。这应该有效：

$(document).on('click', '.view-seats', function(e){
    e.preventDefault();
    console.log('clicked');
})

bootstrap 工具提示标题中的锚点 link 在点击时不像锚点

an anchor link in bootstrap tooltip`s title doesn`t act like an anchor on click

javascript

jquery

css

twitter-bootstrap

twitter-bootstrap-tooltip