如何使用content & setcontent在bootstrap popover中设置变量值？
<script>
function showData(recId,e)
{
Visualforce.remoting.Manager.invokeAction('{!$RemoteAction.ControllerClass.getPopData}',
recId,"{!record.Id}",
function (result, event) {
if(event.status)
alert(result); //Alerts correct value
$('.li').popover({content:result}); //Holds previous value
}, {buffer:false}
);
}
</script>现在我面临的问题是，如果列表中显示了3个项目，我单击的第一个项目显示的是正确的数据，但单击任何其他项目都会显示相同的先前数据，直到我刷新页面并单击为止。然而，在远程操作中，我可以看到每次都会获取正确的数据，但在页面中，它总是显示我单击的第一个项目。
警报显示正确的更新内容，但弹出窗口未在框中设置相同的内容。
我还尝试了下面的方法，这是我在使用setcontent的一个答案中找到的。这在某种程度上是可行的，但我必须单击两次才能获得正确的内容。在第一次onclick中，它显示了之前的值：
$('.li').popover({
content: 'Loading...'
});
$('.li').attr('data-content', res);
var popover = $('.li').data('popover');
popover.setContent();
popover.$tip.addClass(popover.options.placement);你知道我该怎么解决这个问题吗？
根据评论进行了更新。它几乎可以工作，但当我一个接一个地单击项目时，如果我将鼠标移出并悬停在同一项目上，即使我可以看到远程操作调用正在发生，它也无法显示弹出窗口。
<script>
function showPopup(recId,e)
{
var res='';
Visualforce.remoting.Manager.invokeAction('{!$RemoteAction.ControllerClass.getData}',
recId,"{!record.Id}",
function (result, event) {
if(event.status)
res=result;
$('.li').popover("destroy").popover({content:res, placement: "bottom", template: '<div class="popover" style="width:250px; font-size:12px"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'
});
},{ buffer: false}
);
}
</script>回答 1
Stack Overflow用户
发布于 2018-06-27 03:22:47
给定每个BS3文档的基本弹出窗口，您可以：
<button type="button" class="btn btn-primary li"
title="Popover title" >
Click to toggle popover
</button>使用<script>
// Where the `html` property is true or false
// if your returned dynamic data is
// html or simple text respectively.
var po_options = {
html : true,
content : function() {
// $(this) is set to the element with the popover
// get your_data,
return your_data;
}
};并通过以下方式初始化：
$('.li').popover(po_options);在此代码片段中，您可以看到带有返回内容的弹出窗口。您所需要做的就是根据所单击的.li传递适当的参数，并将您的数据检索代码传递给它，这样就可以了
var po_options = {
html: true,
content: function() {
var p1 = $(this).data("param1");
return '<span>' + p1 + '</span>';
}
};
$('.li').popover(po_options);<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<button type="button" class="btn btn-primary li" title="Popover 1" data-param1="Parameter1">
Click to toggle popover 1
</button>
<br />
<br />
<button type="button" class="btn btn-primary li" title="Popover 2" data-param1="Parameter2">
Click to toggle popover 2
</button>
附录
不是很正确。我上面的示例旨在显示从单击按钮的数据属性中获取的信息，并旨在向您展示一种将参数传递给工具提示内容处理程序的方法
请考虑以下内容：
我假设你所有的弹出按钮都标记了.li类，所以像这样初始化弹出按钮：
$('.li').popover(po_options);其中po_options定义为
var po_options = {
html : true,
content : function() {
var p1 = 'Loading...';
Visualforce.remoting.Manager.invokeAction(
'{!$RemoteAction.ControllerClass.getData}',
recId,"{!record.Id}",
function (result, event) {
if(event.status) {
p1 = result;
}
});
return p1;
}
};现在有几件事需要考虑：
如果调用成功，那么在result
- Is中是什么对
invokeAction阻塞或非阻塞的调用，即同步或非阻塞
Item #2非常重要。
如果调用是同步的，那么假设result是html文本，那就没问题了。
但是，如果调用是异步的，则不太可能看到工具提示内容，因为po_options.content处理程序可能会在invokeAction参数result获得值之前返回。
https://stackoverflow.com/questions/51036685
复制相似问题