如何检查Twitter Bootstrap弹出窗口是否可见? [英] How to check whether a twitter bootstrap popover is visible or not?

问题描述

我有一个元素$('#anElement')附加了潜在的弹出框，例如

I have an element $('#anElement') with a potential popover attached, like

<div id="anElement" data-original-title="my title" data-trigger="manual" data-content="my content" rel="popover"></div>

我只是想知道如何检查弹出窗口是否可见:如何用jQuery完成?

I just would like to know how to check whether the popover is visible or not: how this can be accomplished with jQuery?

推荐答案

如果您正在使用的框架中未内置此功能(不再是 twitter 引导程序，只需

If this functionality is not built into the framework you are using (it's no longer twitter bootstrap, just bootstrap), then you'll have to inspect the HTML that is generated/modified to create this feature of bootstrap.

看看弹出式文档.那里有一个按钮，您可以使用它来查看操作.这是检查幕后工作的HTML元素的好地方.

Take a look at the popupver documentation. There is a button there that you can use to see it in action. This is a great place to inspect the HTML elements that are at work behind the scene.

破解打开您的chrome开发人员工具或firebug(firefox)，然后看看发生了什么.看来在按钮后只是插入<div>-

Crack open your chrome developers tools or firebug (of firefox) and take a look at what it happening. It looks like there is simply a <div> being inserted after the button -

<div class="popover fade right in" style="... />

所有您需要做的就是检查该元素是否存在.根据标记的编写方式，您可以使用类似这样的内容-

All you would have to do is check for the existence of that element. Depending on how your markup is written, you could use something like this -

if ($("#popoverTrigger").next('div.popover:visible').length){
  // popover is visible
}

#popoverTrigger是触发该弹出框显示在最前面的元素，并且正如我们在上面注意到的那样，引导程序只是将popover div附加在该元素之后.

#popoverTrigger is the element that triggered that popover to appear in the first place and as we noticed above, bootstrap simply appends the popover div after the element.

这篇关于如何检查Twitter Bootstrap弹出窗口是否可见?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！