全局范围bootstrap popover

时间:2014-09-26 11:32:02

标签: jquery html twitter-bootstrap

是否可以创建单个引导程序弹出框并且可以在任何元素单击它时调用它?

我正在制作一个列表来跟踪网站上的任何错误,目标是当按下删除错误按钮时,弹出框将带有一个文本框,并要求您输入解决方案以解决错误。

我知道我可以使用模态执行此操作并相应地填充字段并在页面上共享一个模态。但我觉得它们很突兀,我不喜欢它们。对于弹出窗口我不知道如何制作单个实例。我没有运气,因为标记基本上与触发它的链接配对。

1 个答案:

答案 0 :(得分:0)

容易做到。您可以将函数传递给popover的内容。所有的popovers都会有这个功能。

单击下面的按钮运行代码。

$(function() {

  $('.btn').popover({
    content: function() {
      // do anything you want here.
      
      $('.btn').popover('hide');

      return 'this appears for all the popovers!  The button you clicked said: "' + $(this).html() + '"';
    }
  });
});
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" />

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

<p><a href="#" class="btn btn-primary">click me</a>
</p>
<p><a href="#" class="btn btn-primary">or click me</a>
</p>
<p><a href="#" class="btn btn-primary">or even click me</a>
</p>