首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >防止引导工具提示在祖先给定类时显示

防止引导工具提示在祖先给定类时显示
EN

Stack Overflow用户
提问于 2014-08-31 13:43:52
回答 1查看 711关注 0票数 1

我有一个侧边栏菜单,用户可以折叠成图标,当需要时,尽量减少菜单的水平空间。当菜单被折叠并悬停一个菜单图标时,它通常的菜单文本延伸到右边。一些菜单项还附加了引导工具提示,这些提示显示在条目的右侧,以显示比菜单中合理的信息更多的信息。

但是,当菜单被折叠时,这些工具提示会妨碍显示在右边的菜单文本。我希望工具提示出现在完整的菜单项上(因此在扩展后的图标和文本上悬停),所以我不能仅仅将工具提示分配给菜单文本。

当菜单被折叠时,它会得到一个附加的类来标记它。

是否有一种简单的方法仅在菜单折叠时才抑制这些工具提示,而不必在菜单的折叠状态更改时重新初始化每个相关元素上的工具提示内容?

简化后的版本是,给定这个HTML:

代码语言:javascript
运行
复制
<div class="sidebar">
    <div title="A tooltip">Menu item 1</div>
    <div title="Another tooltip">Menu item 2</div>
    <div title="Another tooltip">Menu item 3</div>
</div>

这段代码连接了工具提示:

代码语言:javascript
运行
复制
$(".sidebar [title]").tooltip();

有什么简单的方法可以防止在.sidebar.min时显示这些工具提示吗?而不必在添加tooltip("destroy")时调用.min,然后在删除它时再次调用tooltip()

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-08-31 13:49:19

事实证明,这比我想象的要容易得多:show.bs.tooltip事件气泡,也可以取消,所以如果我在.sidebar上捕捉到它,我可以检查.sidebar是否有.min,并取消事件:

代码语言:javascript
运行
复制
$(".sidebar").on("show.bs.tooltip", function(e) {
    if ($(this).hasClass("min")) {
        return false;
    }
});

或者,如果我有各种各样的元素想要这样做,我可以在document上捕获它,然后在e.target的相关祖先上查找一个标记类(这是与工具提示相关联的元素):

代码语言:javascript
运行
复制
$(document).on("show.bs.tooltip", function(e) {
    if ($(e.target).closest(".min")[0]) { // or whatever class is relevant
        return false;
    }
});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/25592561

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档