Как перенаправить на другую веб-страницу?

Как перенаправить пользователя с одной страницы на другую с помощью jQuery или чистого JavaScript?

Ответы

Ответ 1

Один не просто перенаправить с помощью jQuery

JQuery не является необходимым, и window.location.replace(...) будет лучше всего имитировать перенаправление HTTP.

window.location.replace(...) лучше, чем использование window.location.href, потому что replace() не сохраняет исходную страницу в истории сеанса, а это означает, что пользователь не застрянет в бесконечной фиаско кнопки.

Если вы хотите смоделировать кого-то, кто нажимает на ссылку, используйте location.href

Если вы хотите симулировать перенаправление HTTP, используйте location.replace

Например:

// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");

// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";

Ответ 2

ВНИМАНИЕ: этот ответ был предоставлен только в качестве возможного решения; это, очевидно, не лучшее решение, так как оно требует jQuery. Вместо этого, предпочтите чистое решение JavaScript.

$(location).attr('href', 'http://stackoverflow.com')

Ответ 3

Стандартный "ванильный" способ JavaScript для перенаправления страницы

window.location.href = 'newPage.html';

Или проще: (поскольку `window` является глобальным)

location.href = 'newPage.html';

Если вы находитесь здесь, потому что теряете HTTP_REFERER при перенаправлении, продолжайте читать:

(Otherwise ignore this last part)

Следующий раздел предназначен для тех, кто использует HTTP_REFERER в качестве одной из многих мер безопасности (хотя это не очень хорошая мера защиты). Если вы используете Internet Explorer 8 или ниже, эти переменные теряются при использовании любой формы перенаправления страниц JavaScript (location.href и т.д.).

Ниже мы собираемся реализовать альтернативу для IE8 & ниже, чтобы мы не теряли HTTP_REFERER. В противном случае вы почти всегда можете просто использовать window.location.href.

Тестирование по HTTP_REFERER (вставка URL, сеанс и т.д.) Может помочь определить, является ли запрос законным. (Примечание: есть также способы обойти/подделать этих рефералов, как отмечено в комментариях дропа)

Простое решение для кросс-браузерного тестирования (возврат к window.location.href для Internet Explorer 9+ и всех других браузеров)

Использование: redirect('anotherpage.aspx');

function redirect (url) {
    var ua        = navigator.userAgent.toLowerCase(),
        isIE      = ua.indexOf('msie') !== -1,
        version   = parseInt(ua.substr(4, 2), 10);

    // Internet Explorer 8 and lower
    if (isIE && version < 9) {
        var link = document.createElement('a');
        link.href = url;
        document.body.appendChild(link);
        link.click();
    }

    // All other browsers can use the standard window.location.href (they don't lose HTTP_REFERER like Internet Explorer 8 & lower does)
    else { 
        window.location.href = url; 
    }
}

Ответ 4

Есть много способов сделать это.

// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// window.history
window.history.back()
window.history.go(-1)

// window.navigate; ONLY for old versions of Internet Explorer
window.navigate('top.jsp')


// Probably no bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')

Ответ 5

Это работает для каждого браузера:

window.location.href = 'your_url';

Ответ 6

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

<a href='/path-to-page?page=1' class='pager-link'>1</a>
<a href='/path-to-page?page=2' class='pager-link'>2</a>
<span class='pager-link current-page'>3</a>
...

Обратите внимание, что текущая страница в примере обрабатывается по-разному в коде и с CSS.

Если вы хотите, чтобы постраничные данные были изменены с помощью AJAX, здесь будет задействован jQuery. Что бы вы сделали, это добавить обработчик кликов для каждого из якорных тегов, соответствующих другой странице. Этот обработчик будет вызывать некоторый код jQuery, который отправляется и выводит следующую страницу через AJAX и обновляет таблицу новыми данными. В приведенном ниже примере предполагается, что у вас есть веб-служба, которая возвращает новые данные страницы.

$(document).ready( function() {
    $('a.pager-link').click( function() {
        var page = $(this).attr('href').split(/\?/)[1];
        $.ajax({
            type: 'POST',
            url: '/path-to-service',
            data: page,
            success: function(content) {
               $('#myTable').html(content);  // replace
            }
        });
        return false; // to stop link
    });
});

Ответ 7

Я также думаю, что location.replace(URL) - лучший способ, но если вы хотите уведомить поисковые системы о своем перенаправлении (они не анализируют код JavaScript для просмотра перенаправления), вы должны добавить rel="canonical" meta тег на ваш сайт.

Добавление раздела noscript с метатегами обновления HTML в нем также является хорошим решением. Я предлагаю вам использовать этот инструмент перенаправления JavaScript для создания перенаправления. Он также имеет поддержку Internet Explorer для передачи HTTP-реферера.

Пример кода без задержки выглядит следующим образом:

<!-- Place this snippet right after opening the head tag to make it work properly -->

<!-- This code is licensed under GNU GPL v3 -->
<!-- You are allowed to freely copy, distribute and use this code, but removing author credit is strictly prohibited -->
<!-- Generated by http://insider.zone/tools/client-side-url-redirect-generator/ -->

<!-- REDIRECTING STARTS -->
<link rel="canonical" href="https://yourdomain.com/"/>
<noscript>
    <meta http-equiv="refresh" content="0;URL=https://yourdomain.com/">
</noscript>
<!--[if lt IE 9]><script type="text/javascript">var IE_fix=true;</script><![endif]-->
<script type="text/javascript">
    var url = "https://yourdomain.com/";
    if(typeof IE_fix != "undefined") // IE8 and lower fix to pass the http referer
    {
        document.write("redirecting..."); // Don't remove this line or appendChild() will fail because it is called before document.onload to make the redirect as fast as possible. Nobody will see this text, it is only a tech fix.
        var referLink = document.createElement("a");
        referLink.href = url;
        document.body.appendChild(referLink);
        referLink.click();
    }
    else { window.location.replace(url); } // All other browsers
</script>
<!-- Credit goes to http://insider.zone/ -->
<!-- REDIRECTING ENDS -->

Ответ 8

Но если кто-то хочет перенаправить на домашнюю страницу, он может использовать следующий фрагмент.

window.location = window.location.host

Было бы полезно, если бы у вас было три разных среды: разработка, постановка и производство.

Вы можете изучить это окно или объект window.location, просто разместив эти слова в консоли Chrome или Firebug.

Ответ 9

JavaScript предоставляет вам множество методов для извлечения и изменения текущего URL-адреса, отображаемого в адресной строке браузера. Все эти методы используют объект Location, который является свойством объекта Window. Вы можете создать новый объект Location, имеющий текущий URL, следующим образом.

var currentLocation = window.location;

Основная структура URL

<protocol>//<hostname>:<port>/<pathname><search><hash>

Протокол. Указывает имя протокола, которое будет использоваться для доступа к ресурсу в Интернете. (HTTP (без SSL) или HTTPS (с SSL))
hostname - имя хоста указывает хост, которому принадлежит ресурс. Например, www.stackoverflow.com. Сервер предоставляет службы, используя имя хоста.
port - номер порта, используемый для распознавания определенного процесса, к которому переадресован Интернет или другое сетевое сообщение, когда оно прибывает на сервер.
pathname. Путь дает информацию о конкретном ресурсе хоста, к которому хочет получить доступ веб-клиент. Например, stackoverflow.com/index.html.
query. Строка запроса следует за компонентом пути и предоставляет строку информации, которую ресурс может использовать для какой-либо цели (например, в качестве параметров для поиска или данных, подлежащих обработке).
hash - Якорная часть URL-адреса, содержит знак хеша (#).

С помощью этих свойств объекта Location вы можете получить доступ ко всем этим компонентам URL

хэш - устанавливает или возвращает привязную часть URL-адреса.
хост -Sets или возвращает имя хоста и порт URL-адреса.
имя хоста - устанавливает или возвращает имя хоста URL-адреса.
href - устанавливает или возвращает весь URL.
pathname - устанавливает или возвращает путь к URL-адресу.
порт - устанавливает или возвращает номер порта, который сервер использует для URL-адреса.
протокол - устанавливает или возвращает протокол URL.
поиск -Sets или возвращает часть запроса URL-адреса.

Теперь Если вы хотите изменить страницу или перенаправить пользователя на какую-либо другую страницу, вы можете использовать свойство href объекта Location, например,

Вы можете использовать свойство href объекта Location.

window.location.href = "http://www.stackoverflow.com";

Объект местоположения также имеют эти три метода

assign() - загружает новый документ.
reload() - перезагружает текущий документ.
replace() - заменяет текущий документ новым

Вы можете использовать функции assign() и replace также для перенаправления на другие страницы, такие как

location.assign("http://www.stackoverflow.com");

location.replace("http://www.stackoverflow.com");

Как присваивать() и replace() отличается. Разница между методом replace() и методом assign() заключается в том, что replace() удаляет URL-адрес текущего документа из история документа, означает, что нельзя использовать кнопку "назад", чтобы вернуться к исходному документу. Таким образом, используйте метод assign(), если вы хотите загрузить новый документ, и дайте возможность перейти к исходному документу.

Вы можете изменить свойство href объекта местоположения, используя jQuery, также как это

$(location).attr('href',url);

И, следовательно, вы можете перенаправить пользователя на другой URL-адрес.

Ответ 10

По сути, jQuery - это просто инфраструктура JavaScript, и для выполнения некоторых вещей, таких как перенаправление в этом случае, вы можете просто использовать чистый JavaScript, поэтому в этом случае у вас есть 3 варианта использования vanilla JavaScript:

1) Определение местоположения с помощью замены, это заменит текущую историю страницы, означает, что невозможно использовать кнопку назад, чтобы вернуться к исходной странице.

window.location.replace("http://stackoverflow.com");

2) Используя назначение местоположения, вы сохраните историю, а с помощью кнопки назад вы можете вернуться на исходную страницу:

window.location.assign("http://stackoverflow.com");

3) Я рекомендую использовать один из этих предыдущих способов, но это может быть третий вариант с использованием чистого JavaScript:

window.location.href="http://stackoverflow.com";

Вы также можете написать функцию в jQuery для ее обработки, но это не рекомендуется, поскольку это всего лишь одна строка функции JavaScript, также вы можете использовать все вышеперечисленные функции без окна, если вы уже находитесь в области видимости окна, например window.location.replace("http://stackoverflow.com"); может быть location.replace("http://stackoverflow.com");

Также я показываю их все на изображении ниже:

Ответ 11

Должен быть в состоянии установить, используя window.location.

Пример:

window.location = "https://stackoverflow.com/";

Вот предыдущий пост на эту тему: Как мне перенаправить на другую веб-страницу?

Ответ 12

Прежде чем я начну, jQuery - это библиотека JavaScript, используемая для манипулирования DOM. Таким образом, вы не должны использовать jQuery для перенаправления страницы.

Цитата из Jquery.com:

Хотя jQuery может работать без серьезных проблем в старых версиях браузера, мы не проводим в них активное тестирование jQuery и обычно не исправляем ошибки, которые могут в них появляться.

Это было найдено здесь: https://jquery.com/browser-support/

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

Следующее решение, использующее сырой JavaScript, работает во всех браузерах и долгое время было стандартным, поэтому вам не нужны никакие библиотеки для кросс-браузерной поддержки.

Эта страница будет перенаправлена в Google через 3000 миллисекунд

<!DOCTYPE html>
<html>
    <head>
        <title>example</title>
    </head>
    <body>
        <p>You will be redirected to google shortly.</p>
        <script>
            setTimeout(function(){
                window.location.href="http://www.google.com"; // The URL that will be redirected too.
            }, 3000); // The bigger the number the longer the delay.
        </script>
    </body>
</html>

Различные варианты заключаются в следующем:

window.location.href="url"; // Simulates normal navigation to a new page
window.location.replace("url"); // Removes current URL from history and replaces it with a new URL
window.location.assign("url"); // Adds new URL to the history stack and redirects to the new URL

window.history.back(); // Simulates a back button click
window.history.go(-1); // Simulates a back button click
window.history.back(-1); // Simulates a back button click
window.navigate("page.html"); // Same as window.location="url"

При использовании замены кнопка "Назад" не вернется на страницу перенаправления, как если бы она никогда не была в истории. Если вы хотите, чтобы пользователь мог вернуться на страницу перенаправления, используйте window.location.href или window.location.assign. Если вы используете опцию, которая позволяет пользователю вернуться на страницу перенаправления, помните, что при входе на страницу перенаправления вы будете перенаправлены обратно. Поэтому учитывайте это при выборе опции для вашего перенаправления. В условиях, когда страница перенаправляется только тогда, когда пользователь выполняет действие, тогда наличие страницы в истории кнопки возврата будет в порядке. Но если страница автоматически перенаправляет, вы должны использовать замену, чтобы пользователь мог использовать кнопку "назад", не возвращаясь к странице, которую перенаправляет.

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

МЕТА Обновить

<meta http-equiv="refresh" content="0;url=http://evil.com/" />

META Расположение

<meta http-equiv="location" content="URL=http://evil.com" />

BASE Hijacking

<base href="http://evil.com/" />

На этой странице можно найти еще много способов перенаправить вашего ничего не подозревающего клиента на страницу, которую он может не захотеть открыть (ни один из них не зависит от jQuery):

https://code.google.com/p/html5security/wiki/RedirectionMethods

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

Следующий абзац является гипотетическим:

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

Ознакомьтесь с рекомендациями Google для веб-мастеров по перенаправлениям: https://support.google.com/webmasters/answer/2721217?hl=ru&ref_topic=6001971.

Вот забавная маленькая страница, которая вышибает вас из этой страницы.

<!DOCTYPE html>
<html>
    <head>
        <title>Go Away</title>
    </head>
    <body>
        <h1>Go Away</h1>
        <script>
            setTimeout(function(){
                window.history.back();
            }, 3000);
        </script>
    </body>
</html>

Если вы объедините два примера страниц вместе, у вас получится младенческая петля перенаправления, которая гарантирует, что ваш пользователь никогда больше не захочет использовать ваш сайт.

Ответ 13

var url = 'asdf.html';
window.location.href = url;

Ответ 14

Это работает с jQuery:

$(window).attr("location", "http://google.fr");

Ответ 15

Вы можете сделать это без jQuery как:

window.location = "http://yourdomain.com";

И если вы хотите только jQuery, тогда вы можете сделать это как:

$jq(window).attr("location","http://yourdomain.com");

Ответ 16

# Пересылка HTML-страницы с помощью jQuery/JavaScript

Попробуйте этот примерный код:

function YourJavaScriptFunction()
{
    var i = $('#login').val();
    if (i == 'login')
        window.location = "login.php";
    else
        window.location = "Logout.php";
}

Если вы хотите указать полный URL как window.location = "www.google.co.in";.

Ответ 17

Вам нужно вставить эту строку в свой код:

$(location).attr("href","http://stackoverflow.com");

Если у вас нет jQuery, используйте JavaScript:

window.location.replace("http://stackoverflow.com");
window.location.href("http://stackoverflow.com");

Ответ 18

Итак, вопрос заключается в том, как сделать страницу перенаправления, а не как перенаправить на веб-сайт?

Для этого вам нужно использовать JavaScript. Вот небольшой код, который создаст страницу динамической переадресации.

<script>
    var url = window.location.search.split('url=')[1]; // Get the URL after ?url=
    if( url ) window.location.replace(url);
</script>

Итак, скажите, что вы просто поместили этот фрагмент в файл redirect/index.html на своем веб-сайте, вы можете использовать его так.

http://www.mywebsite.com/redirect?url=http://stackoverflow.com

И если вы перейдете по этой ссылке, он автоматически перенаправит вас на stackoverflow.com.

Ссылка на документацию

И как вы создаете страницу простого перенаправления с JavaScript

Edit:

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

Пример:

Процесс: сохранить домой = > перенаправить страницу в google = > Google

Когда в google: google = > кнопка возврата в браузере = > сохранить домой

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

if( url ) window.location.replace(url);

if( url ) window.location.href = url;

Ответ 19

В вашей функции щелчка просто добавьте:

window.location.href = "The URL where you want to redirect";
$('#id').click(function(){
    window.location.href = "http://www.google.com";
});

Ответ 20

Оригинальный вопрос: "Как перенаправить с помощью jQuery?", Следовательно, ответ реализует jQuery >> Бесплатный пример использования.

Чтобы просто перенаправить на страницу с помощью JavaScript:

window.location.href = "/contact/";

Или, если вам нужна задержка:

setTimeout(function () {
  window.location.href = "/contact/";
}, 2000);   // Time in milliseconds

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

$('a,img').on('click',function(e){
  e.preventDefault();
  $(this).animate({
    opacity: 0 //Put some CSS animation here
  }, 500);
  setTimeout(function(){
    // OK, finished jQuery staff, let go redirect
    window.location.href = "/contact/";
  },500);
});

Представьте, что кто-то написал скрипт/плагин с 10000 строками кода. С помощью jQuery вы можете подключиться к этому коду всего одной или двумя строками.

Ответ 21

Попробуйте следующее:

location.assign("http://www.google.com");

фрагмент кода примера.

Ответ 22

jQuery не требуется. Вы можете сделать это:

window.open("URL","_self","","")

Это так просто!

Лучший способ инициировать HTTP-запрос - document.loacation.href.replace('URL').

Ответ 23

Сначала напишите правильно. Вы хотите перемещаться внутри приложения для другой ссылки из вашего приложения для другой ссылки. Вот код:

window.location.href = "http://www.google.com";

И если вы хотите перемещаться по страницам в своем приложении, тогда у меня также есть код, если вы хотите.

Ответ 24

Вы можете перенаправить в jQuery следующим образом:

$(location).attr('href', 'http://yourPage.com/');

Ответ 25

JavaScript:

window.location.href='www.your_url.com';
window.top.location.href='www.your_url.com';
window.location.replace('www.your_url.com');

Jquery:

var url='www.your_url.com';
$(location).attr('href',url);
$(location).prop('href',url);//instead of location you can use window

Ответ 26

ECMAScript 6 + jQuery, 85 байт

$({jQueryCode:(url)=>location.replace(url)}).attr("jQueryCode")("http://example.com")

Пожалуйста, не убивайте меня, это шутка. Это шутка. Это шутка.

Это "обеспечило ответ на вопрос" в том смысле, что он попросил решение "с использованием jQuery", которое в этом случае влечет за собой принудительное его вложение в уравнение.

Ferrybig, видимо, нуждается в объяснении шутки (по-прежнему шутя, я уверен, что в форме обзора есть ограниченные возможности), поэтому без дальнейших церемоний:

Другие ответы используют jQuery attr() для объектов location или window без необходимости.

Этот ответ также злоупотребляет им, но более смешно. Вместо того, чтобы использовать его для установки местоположения, это использует attr() для извлечения функции, которая устанавливает местоположение.

Эта функция называется jQueryCode, хотя ничего нет jQuery, и вызов функции somethingCode просто ужасен, особенно когда что-то не является даже языком.

"85 байтов" - это ссылка на Code Golf. Гольф, очевидно, не то, что вы должны делать вне поля для гольфа, и, кроме того, этот ответ явно не в гольф.

В основном, съеживается.

Ответ 27

В JavaScript и jQuery мы можем использовать следующий код для перенаправления одной страницы на другую страницу:

window.location.href="http://google.com";
window.location.replace("page1.html");

Ответ 28

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

<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Your Document Title</title>
    <script type="text/javascript">
        function delayer(delay) {
            onLoad = setTimeout('window.location.href = "http://www.google.com/"', delay);
        }
    </script>
</head>

<body>
    <script>
        delayer(8000)
    </script>
    <div>You will be redirected in 8 seconds!</div>
</body>

</html>

Ответ 29

Существует три основных способа сделать это,

window.location.href='blaah.com';
window.location.assign('blaah.com');

и...

window.location.replace('blaah.com');

Последнее лучшее, для традиционной переадресации, потому что оно не сохранит страницу, в которую вы отправились, прежде чем перенаправляться в историю поиска. Однако, если вы просто хотите открыть вкладку с помощью JavaScript, вы можете использовать любой из перечисленных выше. 1

EDIT: префикс window не является обязательным.

Ответ 30

Мне просто пришлось обновить эту нелепость еще одним новым методом jQuery:

var url = 'http://www.fiftywaystoleaveyourlocation.com';
$(location).prop('href', url);