如何在HTML css中单击事件的弹出窗口视图中显示现有内容。 [英] How to show the existing content in popover view on click event in HTML css.
本文介绍了如何在HTML css中单击事件的弹出窗口视图中显示现有内容。的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
嗨朋友们,
我有点击内容时显示popover的任务。我需要在Popover中显示现有的html内容。
Hi Friends,
I have the task to show the popover when click the content. i need to show the existing html content in Popover.
<html>
<head></head>
<body>
<div>sampe ref <a href="ref1" onclick="PopOverReference(this)">1</a> sampe data</div>
<div>sampe ref <a href="ref2" onclick="PopOverReference(this)">2</a> sampe data</div>
<div>sampe ref <a href="ref3" onclick="PopOverReference(this)">3</a> sampe data</div>
.
.
.
.
.
<div>
<div>reference</div>
<div class="Bib" id="ref1"> ref1 need to show in popover when click 1</div>
<div class="Bib" id="ref2"> ref2 need to show in popover when click 2</div>
<div class="Bib" id="ref3"> ref3 need to show in popover when click 3</div>
</body>
</html>
我尝试过:
我在onclick wvent中尝试过以下javascript功能。它不起作用。
What I have tried:
I have tried with below javascript funtion in onclick wvent. its not working.
function PopOverReference(var refCit)
{
var attrValue=refCit.getAttribute("href");
var refs=document.body.getElementsByClassName("Bib");
for(var r=0, n = refs.length; r < n; r++)
{
if(attrValue=r.getAttribute("id"))
{
var bindToMe = document.createElement('div')
bindToMe.innerHTML = r.innerHTML;
$('#target').popover({
content: bindToMe,
placement: 'bottom',
html: true
});
}
}
}
推荐答案
( ' #target')。popover({
content:bindToMe,
placement:' bottom',
html: true
}) ;
}
}
}
('#target').popover({ content: bindToMe, placement: 'bottom', html: true }); } } }
这篇关于如何在HTML css中单击事件的弹出窗口视图中显示现有内容。的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文