jQuery Twitter Bootstrap popover 触发器：如何设置多个触发器？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17437818/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Twitter Bootstrap popover trigger: how to set multiple triggers?
提问by StackOverflowNewbie
I'm trying to use http://twitter.github.io/bootstrap/javascript.html#popovers. I can set the trigger to any one of click | hover | focus | manual. Is there a way to set multiple triggers? I want to use hover and focus.
我正在尝试使用http://twitter.github.io/bootstrap/javascript.html#popovers。我可以将触发器设置为click | hover | focus | manual. 有没有办法设置多个触发器？我想使用悬停和焦点。
回答by Andrew Whitaker
This is easy enough to accomplish by defining your own event handlers and showing/hiding the popover via the API:
这很容易通过定义您自己的事件处理程序并通过 API 显示/隐藏弹出框来完成：
HTML:
HTML：
<input id='no-popover' type='text' />
<input id='has-popover' type='text' placeholder='hover or focus me' />
JavaScript:
JavaScript：
var showPopover = function () {
$(this).popover('show');
}
, hidePopover = function () {
$(this).popover('hide');
};
$('#has-popover').popover({
content: 'Popover content',
trigger: 'manual'
})
.focus(showPopover)
.blur(hidePopover)
.hover(showPopover, hidePopover);
Example:http://jsfiddle.net/Xqx8P/
回答by Denis Ivanov
When initializing your popover, you may pass multiple triggers; separate them with a space.
初始化 popover 时，您可能会传递多个触发器；用空格分隔它们。
var options = {
trigger: 'hover focus'
}
$('#has-popover').popover(options);
回答by Clint Eastwood
Related to this question:
与此问题相关：
if anyone uses Bootstrap's popover with AngularJS (using Angular-UI) and wants to define that a popover will be activated"on mouse enter" but deactivatedaccording to one or more events, this code might be helpful:
如果有人使用引导与AngularJS酥料饼（使用角UI），并希望定义一个酥料饼将被激活“鼠标进入”，但停用根据一个或多个事件，该代码可能会有所帮助：
app.config(function ($tooltipProvider) {
// when the user either leaves the element or clicks on it, the tooltip/popover will go off.
$tooltipProvider.setTriggers({
'mouseenter': 'mouseleave click',
'click': 'click',
'focus': 'blur'
});
}
回答by Alireza Fattahi
The reference of what mentioned correctly by @Denis Ivanov
@Denis Ivanov 正确提到的参考资料
Bootstrap 3.0 (http://getbootstrap.com/javascript/#popovers)
Bootstrap 3.0 ( http://getbootstrap.com/javascript/#popovers)
How popover is triggered - click | hover | focus | manual. You may pass multiple triggers; separate them with a space. Default is 'click'
弹出窗口是如何触发的 - 单击 | 悬停| 焦点| 手动的。您可以传递多个触发器；用空格分隔它们。默认为“点击”
回答by Maria Blair
If you use data attributes inside your <a>tag to configure your popover, you can simply put both values, like this:
如果您在<a>标签内使用数据属性来配置弹出框，您可以简单地放置两个值，如下所示：
<a data-trigger="hover focus">
<a data-trigger="hover focus">
Works for me using Bootstrap 2.
使用 Bootstrap 2 对我有用。
