Bootstrap 工具提示“未捕获类型错误：无法读取 null 的属性‘触发器’”

当我尝试显示新的工具提示时，在销毁旧工具提示后，我在 Chrome 控制台中收到“Uncaught TypeError: Cannot read property 'trigger' of null”。

Then, when I was digging in the bootstrap code, I found this: And I suspect that is responsible for the exception I'm getting:

我在创建新的工具提示时尝试使用“选择器”和“容器”属性。 有效的一件事是在另一个按钮上添加一个事件侦听器，以销毁工具提示，这样当我再次单击“注册”时，它可以正常工作并且不会引发异常。

该示例可以在以下位置找到（单击注册两次）：https://jsfiddle.net/08o4qgj5/1/ https://jsfiddle.net/08o4qgj5/1/ Code:

$("form#register").on("click", "button[name='btnRegister']", function () {
    //Destroy tooltip if exists
    $("input[name='email']").tooltip('destroy');
    //Adds new one
    $("input[name='email']").tooltip({title: "CYKA BLYAAAAAAT, IDI NAHUI!",
        placement: 'bottom',
        template:'<div class="tooltip" role="tooltip">' +
        '<div class="tooltip-arrow"></div>' +
        '<div class="tooltip-inner"></div>' +
        '</div>'});
    //Shows it
    $("input[name='email']").tooltip('show');
});

$("form#register").on("click", "button[name='btnDestroy']", function () {
    //Destroys tooltip
  $("input[name='email']").tooltip('destroy');
});

在我向您展示的示例中，这样做有点没用，因为只有 1 个输入。但在我的网站上，我想要发生的是：

1. 销毁任何可能存在的工具提示
2. 验证用户输入
3. 如果输入无效，我想向该输入元素添加新的工具提示

我发现有人遇到的最相似的问题是：Bootstrap 3 工具提示闪烁 https://stackoverflow.com/questions/46865737/bootstrap-3-tooltip-flickers但这并没有为我解决问题。

提前致谢。

由于销毁 html 元素可能需要一些时间，并且其销毁的某些部分甚至可能是异步处理的，因此当您到达新工具提示的创建/显示时，它可能会陷入不需要的状态。

将工具提示的初始化和显示包装在 setTimeout(f(), t) 中 t [250, 400] 在这里效果很好，检查一下这个 JSFiddle https://jsfiddle.net/et7kcbq9/. 你不应该使用你的销毁按钮

setTimeout(function() {
    $("input[name='email']").tooltip({title: "CYKA BLYAAAAAAT, IDI NAHUI!",
                                    placement: 'bottom',
                                    template:'<div class="tooltip" role="tooltip">' +
                                    '<div class="tooltip-arrow"></div>' +
                                    '<div class="tooltip-inner"></div>' +
                                    '</div>'});

    //Shows it
    $("input[name='email']").tooltip('show');
  }, 250);
});