О сайтеПравилаКонтакты
» Статьи » Разработка » Перенаправление пользователя при помощи HTML
  • Инструменты
  • Заработок
  • Раскрутка
24 ноября 2014 . Антон Кулешов

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

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

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

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

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

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

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

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

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

function timeBack(){

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

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

<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/" />

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

4 007
Антон Кулешов
Комментарии не найдены

Делаем красивые чекбоксы в стиле IOS7

FlexSlider - адаптивный слайдер для сайта

Популярное
1 Пишем парсер контента на PHP2 Кликджекинг как соцфишинг, пишем скрипт для получения id пользователя вконтакте3 Лучший способ прижать футер используя flexbox4 Пишем первый модуль для 1С-Битрикс с использованием ядра D75 Делаем подгрузку контента при прокрутке страницы
Обратите внимание
kwork