Вывод информации при клике на ссылку

17.01.2021 02:36:10 pm

Доброго времени суток!
Подскажите, как можно вывести информации, типа блока, при нажатии на ссылку?

Задумка такая: при клике на ссылку, что ведет на чужой сайт, надо вывести блок с предупреждением, мол мы не несем ответственность за то, что находится на сайте, куда Вы собираетесь перейти.

Заранее спасибо.

Жалоба

17.01.2021 07:24:12 pm

Как вариант: Код блока:

<div id="block"></div>

Пример ссылки:

<a href="#" onclick="openLink('https://yandex.ru/'); return false;">Link</a>

И код функции:

function openLink(url) {
	document.getElementById('block').innerHTML = 'Мы не несём ни какой ответственности, за содержимое на сайте: <strong>' + url + '</strong>. Для перехода, кликните на ссылку:  <a href="' + url + '">' + url + '</a>.';
};

Жалоба

18.01.2021 06:38:25 pm

Спасибо, Slash. Вставил блок под шапку сайта. Немного приукрасил блок, выглядит солидно. Но, этот блок виден постоянно, как можно сделать, чтобы он появлялся только, когда кликнули по ссылке на чужой сайт? И исчезал, после клика на ссылку в блоке?

Сделал, чтобы ссылка открывалась в новой вкладке:

function openLink(url) {
	document.getElementById('block').innerHTML = 'Мы не несём ни какой ответственности, за содержимое на сайте: <strong>' + url + '</strong>. Для перехода, кликните на ссылку:  <a href="' + url + '" target="_blank">' + url + '</a>.';
};

Так лучше, ведь пользователь не уходит с сайта.

Жалоба

18.01.2021 07:17:00 pm

Попробуйте так: Добавьте к стилю блока свойство display: none;:

#block {
	display: none;
}

И перепишите JS так:

var block = document.getElementById('block');

function openLink(url) {
	block.style.display = 'block';
	block.innerHTML = 'Мы не несём ни какой ответственности, за содержимое на сайте: <strong>' + url + '</strong>. Для перехода, кликните на ссылку:  <a href="' + url + '" onclick="closeBlock();" target="_blank">' + url + '</a>.';
};

function closeBlock() {
	block.style.display = 'none';
};

Жалоба

19.01.2021 06:27:35 pm

Спасибо за идею!
Подскажите, а как можно сделать, чтобы не добавлять в каждую ссылку, этот код:

onclick="openLink('https://yandex.ru/'); return false;"

Заранее спасибо.

Жалоба

19.01.2021 10:00:34 pm

Падший ангел, как то так: Пример ссылок:

	<a href="https://yandex.ru/">Yandex</a>
	<a href="https://google.com/">Google</a>
	<a href="https://danfa.net/">DANFA</a>

JS:

var block = document.getElementById('block');

var a = document.getElementsByTagName('a');
for (var i = 0; a.length > i; i++) {
	a[i].addEventListener('click', function(e) {
		block.style.display = 'block';

		block.innerHTML = 'Мы не несём ни какой ответственности, за содержимое на сайте: <strong>' + this.href + '</strong>. Для перехода, кликните на ссылку:  <a href="' + this.href + '" onclick="closeBlock();" target="_blank">' + this.href + '</a>.';
		e.preventDefault();
	});
};

function closeBlock() {
	block.style.display = 'none';
};

Жалоба

20.01.2021 06:50:25 am

Slash, супер! Но есть одна неприятность. Блок появляется при нажатии на любую ссылку, как на ссылку, что ведет на чужой сайт, так на свой, на другую страницу. Можно разделить ссылки, чтобы блок появлялся только для чужих сайтов?

Жалоба