我如何使用“div”在Twitter的与多个按钮的Popover? [英] How can I use "div" in Twitter's Popover with multiple buttons?
问题描述
这个解决方案适用于一个按钮的情况:是否可以使用div作为Twitter的Popover内容
但在我的页面中,我有一堆popovers(比如50-100 )。
所以我需要修改这个解决方案。
这个wa @jävi的解决方案:
$(document).ready(function(){
$('。danger')。popover({
html:true,
content:function(){
return $('#popover_content_wrapper')。html();
}
});
});
每个按钮都有自己的ID。
< a class ='danger'data-placement ='above'title =Popover Titlehref ='#'>点击< / a>
< div id =popover_div1style =display:none>
< div>这是您的div内容< / div>
< / div>
< a class ='danger'data-placement ='above'title =Popover Titlehref ='#'>点击< / a>
< div id =popover_div2style =display:none>
< div>这是您的div内容< / div>
< / div>
那么我该如何重写这个javascript代码片段来覆盖我所有的按钮?
我自己就是为此而战。您需要将id放入触发popover的元素中。使用像这样的自定义数据属性(称为'data-id'):
< a class ='danger'data- id =popover_div1data-placement ='above'title =Popover标题href ='#'>点击< / a>
然后,您可以稍微修改您的JavaScript,以编程方式获取data-id属性值:
$ p $
$(document).ready(function(){
$('。danger')。popover({
html:true,
content:function(){
return $($(this).attr('data-id'))。html();
}
} );
});
This solution is ok for one button cases: Is it possible to use a div as content for Twitter's Popover
But in my page I have a bunch of popovers (say 50-100).
So I need to modify this solution.
This wa @jävi's solution:
$(document).ready(function(){
$('.danger').popover({
html : true,
content: function() {
return $('#popover_content_wrapper').html();
}
});
});
Each of my button has its own id.
<a class='danger' data-placement='above' title="Popover Title" href='#'>Click</a>
<div id="popover_div1" style="display: none">
<div>This is your div content</div>
</div>
<a class='danger' data-placement='above' title="Popover Title" href='#'>Click</a>
<div id="popover_div2" style="display: none">
<div>This is your div content</div>
</div>
So how can I rewrite this javascript code snippet to cover all my buttons?
Just fought with this myself. You need to put the id in the element that triggers the popover. Use a custom data attribute like so (called 'data-id'):
<a class='danger' data-id="popover_div1" data-placement='above' title="Popover Title" href='#'>Click</a>
Then you can modify your javascript slightly to grab the data-id attribute value programmatically:
$(document).ready(function(){
$('.danger').popover({
html : true,
content: function() {
return $($(this).attr('data-id')).html();
}
});
});
这篇关于我如何使用“div”在Twitter的与多个按钮的Popover?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!