Как в JS реализуется переход на другую страницу

Редиректы в JavaScript позволяют перенаправлять пользователей на другие страницы. Это может быть как автоматическое перенаправление, так и переход по определенному событию.

Вы узнаете, как реализовать редиректы через разные методы JS, включая window.location и window.location.replace. Вы научитесь контролировать поведение переходов, предотвращать нежелательные циклы и обеспечивать плавный опыт для пользователей, а также увидите на конкретных примерах, как правильно применять эти техники.

Обновлено: 2026-01-19 19:18:05 Вадим Дворниковавтор материала

Автоматическое JavaScript-перенаправление на другую страницу

Если нужно автоматически перенаправить пользователя с одной страницы (URL1 ) на другую страницу (URL2 ), можно использовать следующий код:

window.location.href = 'URL2';

Необходимо вставить приведенный выше код на первую страницу (URL1 ). Замените URL2 на нужный адрес страницы. Лучше поместить этот код внутри элемента <head> (а не в нижней части страницы), чтобы страница перенаправлялась до того, как браузер начинает ее отображать.

СОВЕТ: Если вы используете встроенный JavaScript (т.е. без внешнего файла .js), не забудьте поместить код JavaScript в теги <script></script>.

Перенаправление через X секунд

В этом примере мы будем осуществлять js редирект на другую страницу через некоторое время после загрузки страницы. Например, если нужно перенаправить посетителя на главную страницу после отображения страницы приветствия в течение 5 секунд:

setTimeout(function(){
  window.location.href = 'homepage-url';
}, 5 * 1000);

Необходимо вставить приведенный код JavaScript на странице приветствия. Не забудьте заменить homepage-url на URL-адрес домашней страницы.

Мы использовали метод setTimeout, чтобы указать скрипту выполнить перенаправление через 5 секунд (умножаем 5 на 1000, чтобы преобразовать секунды в миллисекунды).

СОВЕТ: В JavaScript значения времени всегда рассчитываются в миллисекундах.

Перенаправление , исходя из условия

Например, можно выполнить перенаправление в зависимости от браузера посетителя (хотя это не рекомендуется), размера экрана, времени суток, или другого условия.

Используйте следующий код для перенаправления посетителей, которые удовлетворяют определенному условию:

if (CONDITION) {
  window.location.href = 'redirect-url';
}

Например, этот код перенаправляет посетителей на другую страницу, если ширина их экрана меньше 600 пикселов:

if (screen.width < 600) {
  window.location.href = 'redirect-url';
}

Перенаправление на основе действий пользователя

Последний пример демонстрирует, как перенаправить посетителя, основываясь на его действиях. Вы можете привязать js редирект к любому типу действия пользователя. В данном примере для простоты мы будем обрабатывать нажатие кнопки.

Следующий код будет перенаправлять посетителя на целевую страницу после нажатия на #mybutton:

document.getElementById('mybutton').onclick = function() {
  window.location.href = 'redirect-url';
};

Можно сделать то же самое, используя следующий код:

<button onclick="window.location.href = '/'">Go to Homepage</button>

Также можно связать перенаправление с любым событием или действием пользователя. Только не забудьте удостовериться, что ваши редиректы не вызовут разочарования пользователей.

Я попытался рассмотреть все возможные случаи js редиректа на другую страницу. Если я когда-либо столкнусь с другими сценариями, я добавлю их в эту статью.