如何在HTML css中单击事件的弹出窗口视图中显示现有内容。 [英] How to show the existing content in popover view on click event in HTML css.

查看:102
本文介绍了如何在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屋!

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