bootstrap 4工具提示与JquerySmoothState冲突

Question

我使用bootstrap 4工具提示进行锚定，并使用jquery smoothstate进行ajax加载，但是如果我单击一个链接，工具提示将挂在下一页，这里是一个屏幕截图：

有没有解决这个问题？

更新

这里的演示链接： http://0o.mrnazi.com:81/bs4/index.html

我正在使用这个jquery插件：https://github.com/miguel-perez/smoothState.js 没有控制台错误

Answer 1

我引用了官方文档：

  

有时需要将Bootstrap插件与其他UI框架一起使用。在这些情况下，偶尔会发生命名空间冲突。如果发生这种情况，您可以在要恢复其值的插件上调用.noConflict。

这里给出的代码示例如下：

＆＃13;

＆＃13;

  var bootstrapButton = $.fn.button.noConflict() // return $.fn.button to previously assigned value
  $.fn.bootstrapBtn = bootstrapButton            // give $().bootstrapBtn the Bootstrap functionality

＆＃13;

＆＃13;

＆＃13;

因此，您的任务是挖掘bootstrap.js文件并找出哪些插件正在执行工具提示。然后将.noConflict方法应用于此。

另请注意：这肯定与popper.js文件/插件相关联，Bootstrap将其用作处理工具提示的依赖项。

https://getbootstrap.com/docs/4.0/getting-started/javascript/#no-conflict

Answer 2

您必须在页面转换开始时隐藏活动的工具提示。

您可以使用smoothState.js中的onStart函数（在页面加载激活后运行。https://github.com/miguel-perez/smoothState.js#onstart）。

将以下代码添加到smoothState.js插件选项中：

onStart: {
    duration: 250,
    render: function($container) {

            // hide the tooltips
            $('[rel=tooltip]').tooltip('hide');

            smoothState.restartCSSAnimations();

    }
 },