代码之家 › 专栏 › 技术社区 › johna

动态更改Bootstrap 4.x Popover的标题和内容

bootstrap-4

1

johna · 技术社区 · 7 年前

当使用Bootstrap 3.x Popover时,我可以通过更改选项然后重新显示Popover来更改Popover标题和内容,如下所示:

var popover = $('#myid').data('bs.popover');

popover.options.title = "My Title";
popover.options.content = "My content";

$("#myid").popover('show');

在4.x中有类似的方法吗?

1 回复 | 直到 7 年前

1

3

azeós 7 年前

答案是: bootstrap popover change content dynamically

$('[data-toggle="popover"]').popover()

$('#myid').attr('data-original-title', 'New title');
$('#myid').attr('data-content', 'New content');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet"/>

<button id="myid" type="button" class="btn btn-lg btn-danger" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">Click to toggle popover</button>