Показать Меню
falbar Перенаправление при помощи HTML

Перенаправление пользователя при помощи HTML

Перенаправление при помощи HTML

Если Вам потребуется перенаправить пользователя на другую страницу или просто перезагрузить её, то наиболее простым способом будет воспользоваться мета тегом refresh.

Обновление страницы осуществляется за счёт указания в атрибуте content времени.

В этом примере браузер обновит страницу через 5 секунд:

<meta http-equiv="refresh" content="5" />

Если Вам нужно перенаправить пользователя, то следует дописать в атрибуте content адрес страницы, куда он должен попасть.

<meta http-equiv="refresh" content="5; url=http://falbar.ru/article/id/47" />

Пользоваться мета тегом refresh стоит аккуратно. Мы же не хотим запутать человека, который зайдёт к нам на сайт. Поэтому указывайте, куда Вы его отправляете и через какое время. Лучший способ это показать - воспользоваться javascript кодам.

Для этого мы напишем функцию timeBack(), которая будет получать значение из параграфа с id=time, уменьшая его на единицу, перезаписывая его ту даже.

<script type="text/javascript">
	function timeBack(){

		var time       = document.getElementById("time");
		time.innerText = parseInt(time.innerText) - 1;
		setTimeout("timeBack()", 1000);
	};
</script>

В теле поместим сообщение и блок со временем (что - бы время доходило до нуля, указываем на одну секунду больше времени перенаправления).

<div style="text-align: center;">
	<p>
		Вы будете перенаправлены на страницу <b>http://falbar.ru/</b> через
	</p>
	<p id="time">
		6
	</p>
	<script type="text/javascript">timeBack();</script>
</div>

А перед всеми этими действиями пропишем сам мета тег:

<meta http-equiv="refresh" content="5; url=http://falbar.ru/" />

Данный подход часто используется при написании обратных форм связи. После того как пользователь заполняет форму и жмёт «отправить», он попадает на страницу показа выполнения результата обработчика. Через несколько секунд браузер возвращает его обратно. В одной из предыдущей статье я рассматривал, как написать такую форму связи, и если Вам интересно увидеть реальный пример предлагаю её прочесть.

Спасибо за внимание.

Подписаться на обновления

Комментариев еще не оставлено