Member 10242311 Ответов: 0

Как показывают существующий контент в всплывающем окне при нажатии в HTML и CSS.

Привет Друзья,
У меня есть задача показать всплывающее окно при нажатии на содержимое. мне нужно показать существующий html-контент в 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>


Что я уже пробовал:

Я попробовал использовать нижеприведенную функцию javascript в onclick wvent. это не работает.

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
			});
		}
	}
}

Richard Deeming

Начните с удаления var из параметра вашей функции - это недопустимый Javascript.

function PopOverReference(refCit)

Затем добавить return false к вашим услугам onclick атрибуты для предотвращения попыток браузера перейти по ссылке:
onclick="PopOverReference(this);return false;"

Чтобы быть семантически корректными, ссылки должны начинаться с"#", чтобы указать, что они указывают на фрагмент текущей страницы, а не на другую страницу:
<a href="#ref1" ...

Christian Graus

Подумайте о том, чтобы рассказать нам, что вы пробовали и что произошло. "Это не работает" - это не объяснение.

0 Ответов