使用Twitter的Bootstrap时,如何更改popover的内容? [英] When using Twitter's Bootstrap, how can I change a popover's content?

查看:78
本文介绍了使用Twitter的Bootstrap时,如何更改popover的内容?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Twitter的Bootstrap js中的popover功能。我有一个按钮,当点击时,执行这个javascript:

  $(#popover_anchor)。popover({trigger: 手动,
放置:下方,
抵消:10,
html:true,
title:function(){returnTITLE;},
content:function(){returnCONTENT TEXT;}});
$(#popover_anchor)。popover(show);

除了标题和内容函数返回不同的文本外,还有另一个按钮执行基本相同的javascript 。



请注意,它们都在同一元素上定义了弹出框,只是内容不同。



问题是,一旦点击任一按钮并执行js,其他按钮的后续点击将不会改变弹出窗口内容。因此,一旦popover初始化,我该如何更新/更改内容?

解决方案

title 属性是接受类型 function 的值,它提供了这个功能。



<例如:如果您将标题设置为:

  title:function(){return randomTxt(); } 

你有,

  function randomTxt()
{
arr = ['blah blah','meh','another one'];
return arr [Math.floor(Math.random()* 4)];
}

您将继续为您的popover获得不同的标题。您可以更改 randomText 的逻辑来动态获取标题。


I'm using the popover feature from Twitter's Bootstrap js. I have a button that, when clicked, executes this javascript:

$("#popover_anchor").popover({trigger: "manual",
                              placement: "below",
                              offset: 10,
                              html: true,
                              title: function(){return "TITLE";},
                              content: function(){return "CONTENT TEXT";}});
$("#popover_anchor").popover("show");

There's also another button that executes basically the same javascript, except that the title and content functions return different text.

Note that they both define the popover on the same element, just with different content.

The problem is, once either button is clicked and the js is executed, no subsequent clicks from the other button will change the popover content. So once the popover is initialized, how can I update/change the content?

解决方案

the purpose of the title attribute is to accept a value of type function which provides this very functionality.

for example: if you set your title to:

 title: function() { return randomTxt(); }

and you have,

function randomTxt()
{
    arr = ['blah blah', 'meh', 'another one'];
    return arr[Math.floor(Math.random() * 4)];
}

you will keep getting a different title for your popover. It is upto you to change the logic of randomText to fetch a title dynamically.

这篇关于使用Twitter的Bootstrap时,如何更改popover的内容?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆