Переадресация страницы (редирект js, редирект html)

Редирект может быть использован для перенаправления посетителей сайта с одной страницы на другую. При редиректе с помощью ява скрипт используются методы объекта location:

1. Метод replace() позволяет заменить одну страницу другой таким образом, что это замещение не будет отражено в истории просмотра HTML-страниц (history) браузера, и при нажатии на кнопку Back, из панели инструментов, пользователь всегда будет попадать на первую загруженную обычным способом страницу.

window.location.replace('http://ya.ru');

2. При изменении свойств location также происходит перезагрузка страниц, но в этом случае записи об их посещении в history пропадают.

location="http://ya.ru"

3. Метод reload() полностью моделирует поведение браузера при нажатии на кнопку reload в панели инструментов. Если вызывать метод без аргумента или указать его равным true, то браузер проверит время последней модификации документа и загрузит его либо из кеша (если документ не был модифицирован), либо с сервера.
Такое поведение соответствует нажатию на кнопку reload.

Если в качестве аргумента указать false, то браузер перезагрузит текущий документ с сервера. Такое поведение соответствует одновременному нажатию на reload и кнопки клавиатуры shift (reload+shift).

window.location.reload(true);

Переадресация страницы через Meta теги HTML

Здесь 1 - время задержки в секундах.

Примеры скриптов для переадресации страниц

Теперь,на основании всего вышеизложенного, приведём примеры javascript redirect т.е. переадресации:
Следующий код вставляется в раздел HEAD документа HTML:

Теперь, надо предусмотреть случай если у клиента отлючен ява скрипт
Для этого ипользуем теги <noscript></noscript> в которых применяем переадресацию с помощью метатэгов HTML.
Для задержки самого редиректа используется фунция setTimeout() в ней 5000 - обозначает изменить текущий адрес страницы через 5 секунд (5000 миллисекунд) Пока будут идти эти 5сек Вы можете вывести пользователю какое либо сообщение типа: "Подождите 5 сек или перейдите по этой ссылке."

Иногда бывает необходимо сделать редирект с таймером прямого или обратного отчёта времени и его выводом на экране во время задержки javascript редиректа.
Сделать это можно с помощью функции setTimeout() следующим образом: мы будем через неё рекурсивно вызывать функцию котороя через 1 сек будет уменьшать или увеличивать значение которым изначально была инициализирована переменная.
А значение этой переменной мы будем показывать пользователю.

var sec=10; // или 1 если необходим прямой отчёт времени
 function Sec()
 {
   // элемент на страничке в котором будет показываться наша переменная
  document.getElementById("sec").innerHTML=sec;

  // каждую секунду уменьшаем значение переменной
  // (или увеличиваем если необходима переадресация
  //с таймером прямого отчёта )
   sec--;

  // на последней секунде таймера делаем редирект
  // и уходим с нашей страницы тем самым прерывая выполнение
  // вызова функции setTimeout()
   if(sec==1)
   {
   	  location.replace("http://e-javascript.ru/redirect.php?pp=7")
   }

   // вызываем фунцию Sec() через одну секунду определённое в переменной sec
   // количество раз - в нашем примере sec==10 (задержка редиректа на 10 сек)
   setTimeout('Sec()',1000);

 }

Что бы посмотреть пример работы редиректа с таймером перейдите по этой ссылке

Код примера редиректа с таймером:

<html>
<head>
<META http-equiv="content-type" content="text/html; charset=windows-1251">
<title></title>
</head>
<body>
<script type="text/javascript">
var sec=10;
 function Sec()
 {

  document.getElementById("sec").innerHTML=sec;
   sec--;
   if(sec==1)
   {
   	  location.replace("http://e-javascript.ru/redirect.php?pp=7")
   }

   setTimeout('Sec()',1000);

 }

</script>

<noscript>

<meta http-equiv="refresh" content="20; http://e-javascript.ru/redirect.php?pp=7">

</noscript>

Подождите пожалуйста
 <span style="color:red;font-weight: bold;" id="sec" name="sec">10</span> сек
 или перейдите по этой ссылке:
 <a href="http://e-javascript.ru/redirect.php?pp=7">
 http://e-javascript.ru/redirect.php?pp=7</a>

<script type="text/javascript">
    Sec();
</script>
</body>
</html>

Ваши вопросы присылайте по адресу mailto.jsbeginning@gmail.com они, вместе с ответами, будут опубликованы на сайте.
Укажите к какому разделу сайта относится Ваш вопрос также Ваш ник или имя.

Полезные бесплатные видеокурсы:

Резиновая вёрстка сайта

Создание собственной CMS на ООП по PHP

Создание сайта на WordPress