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

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上重新初始化它们:完全没有运气.如果我徘徊了很长时间,我会得到一个奇怪的工具提示,但不是一个引导工具提示.

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

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

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

Answer 1

我在 pjax 容器之外使用脚本块#main。当我将下面的代码移动到容器内返回的最下面的脚本块的底部时，生活就很好了。当我使用键盘快捷键进行 AJAX 导航或单击工具提示复选框时，工具提示不会卡住。该工具提示是我第一次加载页面以及使用 AJAX 到达页面时的引导工具提示。（我不确定是否需要调用 off() 但应该不会有什么坏处。）

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