Bootstrap 尽管设置了容器,引导3.3.5工具提示始终显示在模态后面

bogh5gae  于 2022-12-08  发布在  Bootstrap
关注(0)|答案(3)|浏览(201)

我尽了最大的努力,这不是一个重复,尽管它看起来。使用 Bootstrap 3.3.5,我试图显示一个独特的模式对话框内的元素的工具提示,但它们总是落在模式对话框和它的半透明背景后面。我遵循了其他地方给出的建议,我设置了容器。事实上,我使用了4种方法来设置容器都没有用:
1.使用标准标记属性:data-container=".modal-body"(和其他十几个可能的选择器,徒劳)。
1.使用工具提示功能的选项:container.find("[data-toggle='tooltip']").tooltip({ container: ".modal-body" });
1.通过jQuery data函数设置data-containercontainer.find("[data-toggle='tooltip']").data("container", ".modal-body").tooltip();
1.通过jQuery attr函数设置data-containercontainer.find("[data-toggle='tooltip']").attr("data-container", ".modal-body").tooltip();
有什么建议吗?有人可以建议通过CSS增加工具提示的z轴,但是透过半透明的背景,我也观察到工具提示的位置并不完全正确。所以这不仅仅是z轴的问题。
谢谢你的帮助!
PS这是一致的跨所有浏览器。

wxclj1h5

wxclj1h51#

根据BS文件

选择加入功能

出于性能原因,Tooltip和Popover数据API是选择性的,这意味着您必须自己初始化它们。
初始化页面上所有工具提示的一种方法是通过其数据切换属性选择它们:

$(function () {
      $('[data-toggle="tooltip"]').tooltip()
  })

EDIT:已修改以应用示例中定义的工具提示

第一次

clj7thdc

clj7thdc2#

经过彻底的调查,我发现上面观察到的模态元素上的工具提示的错误放置是由于jQueryUI造成的干扰。完全省略jQueryUI会恢复模态元素上的工具提示。注意,除了模态元素,jQueryUI不会损害页面上其他元素上的工具提示。
感谢您抽出宝贵时间提供帮助。

相关问题