Question

我正试图在“选中”复选框时显示我的引导程序弹出窗口，但它似乎只能工作一次。理想情况下，我希望每次“选中”复选框时都会出现，然后在5秒后超时。我已经花了好几个小时摆弄它，似乎无法让它正常工作。

这是我的标记：

<label><input type="checkbox"> Long long long label title </label>

这是我的JS：

$('label input').on('change', function() {

  if ( $('label input').is(':checked') ) {

  $('label').popover({
    placement: 'bottom',
    content: 'This is awesome popover content!.'
  }).on('shown.bs.popover', function() {
    setTimeout(function() {
    $('label').popover('hide');
    }, 5000);
  });

 }

});

这是我的小提琴：

link to my JS fiddle

非常感谢任何建议。谢谢！

Answer 1

您需要做的是在手动触发器上初始化dom准备好popover然后选中复选框时调用show函数

$('label').popover({
    placement: 'bottom',
    content: 'This is awesome popover content!.',
    trigger: 'trigger'
}).on('shown.bs.popover', function (e) {
    setTimeout(function () {
        $(e.target).popover('hide');
    }, 5000);
});

$('label input').on('change', function () {
    if (this.checked) {
        $(this).parent().popover('show')
    }
});

演示：Fiddle

Bootstrap popover只出现一次

1 个答案: