Twitter Bootstrap .on（'show'，function（）{}）;不适用于popover [英] Twitter Bootstrap .on('show',function(){}); not working for popover

问题描述

我试图通过执行以下操作来隐藏所有其他弹出窗口：

I am trying to hide all other popovers when a new popover is selected by doing the following:

我的HTML

a.btn#requests(rel='popover',data-placement='bottom',data-original-title='<b>Requests</b>',data-content='My content goes here')

我的Javascript

My Javascript

  $(function (){
    console.log('start');
    $('#requests').popover();
    $('#messages').popover();

  });

  //This doesn't work for some reason?
  $('#requests').on('show', function (e) {
    console.log('requests');
    $('#messages').popover('hide');
  });

  $('#messages').on('show', function () {
    console.log('messages');
    $('#requests').popover('hide');
  });

但是，我的console.log（'requests'）和console.log（'messages'）;即使请求和消息弹出窗口正在显示，我还没有显示出来，我做错了什么？

However, my console.log('requests') and console.log('messages'); is never getting shown even though the requests and messages popovers are showing, what am I doing wrong?

推荐答案

popover插件没有触发任何事件。工具提示插件也没有（因为popover扩展了工具提示）。查看此问题（github）以了解替代方案。

The popover plugin doesn't trigger any event. Neither does the tooltip plugin (since popover extends tooltip). Check this issue (github) for alternatives.

您可以根据触发器使用不同的JS事件。例如： Demo（jsfiddle）

You can use different JS events depending on your trigger. For your example : Demo (jsfiddle)

$(function (){
    console.log('start');
    $('#requests').popover();
    $('#messages').popover();

    $('#requests').on('click', function (e) {
        console.log('requests');
        $('#messages').popover('hide');
    });

    $('#messages').on('click', function () {
        console.log('messages');
        $('#requests').popover('hide');
    });

});

为什么'点击'？因为版本2.1.1的默认弹出式触发器是，单击。请参阅 popover doc（github）

Why 'click' ? Because the default popover trigger for version 2.1.1 is click. See the popover doc (github)

您可以使用以下事件：

• 触发器：'click'：在上点击


• 触发器：'hover'：显示在 mouseenter 并隐藏在 mouseleave


• 触发器： '焦点'：显示焦点并隐藏模糊


• 触发器：'manual'：使用您自己的代码来显示和隐藏

• trigger: 'click' : on click
• trigger: 'hover' : display on mouseenter and hide on mouseleave
• trigger: 'focus' : display on focus and hide on blur
• trigger: 'manual' : use your own code to display and hide anyway

这篇关于Twitter Bootstrap .on（'show'，function（）{}）;不适用于popover的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！