Jquery：如何显示 Bootstrap 工具提示

Question

在我的情况下，用户放置鼠标在输入控件上时会出现工具提示，但我想触发工具提示。也就是说，当验证失败时，工具提示将显示在输入控件下方。

这是我用来显示工具提示的代码。告诉我在这个代码中需要编辑什么。

var options = { html: true, placement: 'bottom', title: '<div class="tooltip-alert alert-danger" data-placement="bottom">' + message + '</div>' };
        $(inputElement).addClass('validation-error');
        inputElement.tooltip("destroy")
            .addClass("error")
            .tooltip(options);

谢谢

- Thomas

Answer 1

使用方法如下：

$(element).tooltip("show");

所以，当出现验证错误时，您需要使用：

inputElement.tooltip("show");

- Praveen Kumar Purushothaman

---

@Thomas 在显示之前，您已经使用.tooltip(options);初始化了选项。因此，它已经设置了选项。 :) - Praveen Kumar Purushothaman

@Thomas，你能否用http://jsbin.com展示一个可工作的fiddle给我看吗？这对我来说很容易。在发送给我之前，请确保它是可工作的。`:D` - Praveen Kumar Purushothaman

谢谢，我明白了，但是我注意到当工具提示显示时，如果我将鼠标光标移动到该输入框上，那么工具提示就会消失...是否存在任何解决方法？ - Thomas

@Thomas 是的，有的。请稍等一下。 - Praveen Kumar Purushothaman

我希望工具提示不要弹出。当验证成功时，它应该弹出......该怎么办？ - Thomas

Answer 2

经过审阅评论后，我认为你需要一个静态的提示框来显示错误信息。Bootstrap工具提示中的`trigger=manual`正是您需要的。

以下是相关操作的示例代码：Fiddle 更新： 添加了隐藏按钮来隐藏提示框，这是最新的示例代码：Fiddle# 2 希望这些能够对您有所帮助。

- Help :)

- Help

---

在你的fiddle中应该有另一个按钮，当点击时可以关闭工具提示。在我的情况下，工具提示是动态生成在每个表格单元格中的。 - Thomas

感谢您的代码。当打开了很多工具提示时，我该如何关闭所有工具提示呢？假设每个单元格中都有与工具提示相关的HTML，现在我想迭代表格并逐个提取工具提示并隐藏它......这可能吗？ - Thomas

请看这篇帖子：https://dev59.com/7lsW5IYBdhLWcg3winvt - Thomas