如何将垂直菜单项添加到Bootstrap popover？

我在我的网站上使用Bootstrap v3.3.5.我想打开一个包含三个由水平线分隔的菜单项的弹出窗口.

菜单项应垂直,应如下所示:

编辑活动

邀请成员

删除活动

每个菜单项都应该是超链接,以打开一些新的模态对话框或类似的东西.对于它我尝试下面的代码,但它没有为我工作.

  
  
  
  
  




  Toggle popover

Matt D. Webb.. 10

这样的东西应该工作,这是一个JsFiddle示例.

在这里,我使用了一个现有Bootstrap组件,一个列表组作为示例,但您可以将任何组件HTML放入您的popover中:

HTML

  

    

      Toggle popover
    
  




  Edit Event
  Invite Members
  Delete Event

jQuery的

$(function() {
  $('[data-toggle="popover"]').popover({
        html: true,
        content: function() {
            return $('#popover-content').html();
        }
  });
});

一个非常有用的库,可以Bootstrap帮助您创建异步调用(如内联编辑),可以帮助您创建X-Editable

这样的东西应该工作,这是一个JsFiddle示例.

在这里,我使用了一个现有Bootstrap组件,一个列表组作为示例,但您可以将任何组件HTML放入您的popover中:

HTML

  

    

      Toggle popover
    
  




  Edit Event
  Invite Members
  Delete Event

jQuery的

$(function() {
  $('[data-toggle="popover"]').popover({
        html: true,
        content: function() {
            return $('#popover-content').html();
        }
  });
});

一个非常有用的库,可以Bootstrap帮助您创建异步调用(如内联编辑),可以帮助您创建X-Editable