使用 Jquery / Javascript 动态更改弹出框的数据内容答案

【问题标题】：Changing the data-content of popover dynamically using Jquery / Javascript使用 Jquery / Javascript 动态更改弹出框的数据内容
【发布时间】：2016-09-24 06:58:24
【问题描述】：

我正在使用带有 Bootstrap、Jquery、Entity Framework 的 ASP.NET MVC...

我已在按钮上应用了弹出效果，该按钮向我显示了来自部分视图的受尊敬的数据作为悬停的结果。

我面临的问题是我必须单击两次才能获得更新的文本或弹出结果。

为什么我只是不知道请查看我在此处提供的示例并帮助我。请知道的人。

HTML：

<button class="btn btn-success" type="button" data-toggle="popover"
data-trigger="focus" data-placement="top" title="Contact Detail"
id="btnContactInfo" data-html="true">
<i class="fa fa-info"></i></button>

Javascript：

var popover = $('#btnContactInfo').popover({
                     trigger: 'manual'
                 }).popover('show');
                 $('#btnContactInfo')
.popover().on('show.bs.popover', function (e) {
$("#po").html(htmldata);
popover.attr('data-content', $("#po").html());
});

【问题讨论】：

标签： jquery asp.net-mvc dynamic popover bootstrap-popover

【解决方案1】：

哦，我只是做错了。实际上我必须通过使用下面的代码和一些分析来做到这一点，可能对某人有帮助：

HTML 与问题中描述的相同。

Javascript：我们将鼠标悬停在特定的 HTML 控件/按钮功能上：

$("#btnContactInfo").hover(function () {
    $("#btnContactInfo").
    attr('data-content', htmlcode)
    .popover(hide)
    .popover('fixTitle')
    .popover('show');
    });

我刚刚使用了这个答案，该答案对 tooltip 有同样的问题的解决方案，并且使用 popover 的属性同样适用于 popover。

【讨论】：