javascript - Bootstrap 4 工具提示在 jquery-pjax AJAX 调用后停止工作

Question

我是 javascript 的新手，需要您的帮助。第一次加载我的 PJAX 页面时，我的工具提示起作用了:

$(document).ready(function() {
$(document).pjax('a', '#main', {cache: false});
$('[data-toggle="tooltip"]').tooltip();
}

除非我执行以下操作，否则它们会卡住:

$(document).on('pjax:start', function(event) {
$('[data-toggle="tooltip"]').tooltip('dispose');
});

我曾尝试在 pjax:end 或 pjax:complete 上重新初始化它们，但没有成功。如果我长时间悬停，我会得到一个看起来很奇怪的工具提示，但不是引导工具提示。

XHR 完成后如何重新安装工具提示？

Bootstrap v4.0.0-beta.2 https://v4-alpha.getbootstrap.com/components/tooltips/

https://github.com/defunkt/jquery-pjax

Answer 1

我在我的 pjax 容器 #main 之外使用了一个脚本 block 。当我将下面的代码移到容器内返回的最低脚本 block 的底部时，一切都很好。当我使用键盘快捷键进行 AJAX 导航或单击带有工具提示的复选框时，工具提示不会卡住。当我第一次加载页面和使用 AJAX 到达页面时，工具提示是一个引导工具提示。 (我不确定我是否需要调用 off() 但它不应该受到伤害。)

$('[data-toggle="tooltip"]').tooltip();
$(document).off('pjax:start');
$(document).on('pjax:start', function(event) {
    $('[data-toggle="tooltip"]').tooltip('dispose');
});