Bootstrap 只要在页面上单击任何内容，工具提示就会停止工作

Question

在我的页面上，我以这种方式初始化 Bootstrap 工具提示

<script>
    $(document).ready(function () {
        $(function () {
            $('[data-toggle="tooltip"]').tooltip();
        });
    });
</script>

This question 建议每当事件发生时您都必须重新加载工具提示。但是，在各种 ajax 页面更新中，可能需要考虑 50 多个事件。（该站点使用 asp.net 网络表单和 ajaxcontroltoolkit）

如何在每次事件发生时普遍重新启动工具提示？ -- 或者是否有更简单的方法来解决这个问题？

Answer 1

您需要 javascript 引用 Sys.WebForms.PageRequestManager

看看 beginRequest/endRequest 事件。由于 asp.net ajax 正在替换您的 html，您需要在 asp.net 完成其 ajax 后重新绑定 bootstrap 小部件。

试试这个：

<script>
var prm = Sys.WebForms.PageRequestManager.getInstance();
//func to rebind tooltip
function reBind () { $('[data-toggle="tooltip"]').tooltip(); }
$(document).ready(function () {
    $(function () {
        reBind();            
        prm.add_endRequest(reBind);
    });
});
</script>

请注意，某些 bootstrap 小部件如果绑定两次就会损坏，因此请谨慎行事；某些元素可能需要监视它们的事件以查看它们是否绑定了不止一次。

Bootstrap 只要在页面上单击任何内容，工具提示就会停止工作

Bootstrap tooltips stop working whenever anything is clicked on the page

javascript

jquery

webforms

ajaxcontroltoolkit

twitter-bootstrap