javascript user Como faço para redirecionar para outra página da web?




seguir link javascript (24)

Como posso redirecionar o usuário de uma página para outra usando jQuery ou JavaScript puro?



***** A PERGUNTA ORIGINAL FOI - "COMO REDIRECIONAR A UTILIZAÇÃO DA JQUERY", AQUI A RESPOSTA IMPLEMENTA AQUISIÇÃO >> CASO DE USO GRATUITO *****

Para apenas redirecionar para uma página com JavaScript:

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

Ou se você precisar de um atraso:

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

O jQuery permite selecionar elementos de uma página da web com facilidade. Você pode encontrar o que quiser em uma página e usar o jQuery para adicionar efeitos especiais, reagir a ações do usuário ou mostrar e ocultar conteúdo dentro ou fora do elemento selecionado. Todas essas tarefas começam com o conhecimento de como selecionar um elemento ou um evento .

     $('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's go redirect
           window.location.href = "/contact/";
         },500);
     });

Imagine alguém escreveu um script / plugin que é 10000 linhas de código ?! Bem, com jQuery você pode se conectar a este código com apenas uma linha ou duas.


Ajudaria se você fosse um pouco mais descritivo no que você está tentando fazer. Se você está tentando gerar dados paginados, há algumas opções em como você faz isso. Você pode gerar links separados para cada página que você deseja obter diretamente.

<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>
...

Observe que a página atual no exemplo é tratada de maneira diferente no código e com CSS.

Se você quiser que os dados paginados sejam alterados por meio do AJAX, é aqui que o jQuery entraria. O que você faria é incluir um manipulador de cliques em cada uma das tags de âncora correspondentes a uma página diferente. Este manipulador de cliques invocaria algum código jQuery que vai e busca a próxima página via AJAX e atualiza a tabela com os novos dados. O exemplo abaixo pressupõe que você tenha um serviço da Web que retorne os novos dados da página.

$(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
    });
});

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

Eu também acho que location.replace(URL) é a melhor maneira, mas se você quiser notificar os motores de busca sobre o seu redirecionamento (eles não analisam o código JavaScript para ver o redirecionamento) você deve adicionar o meta rel="canonical" tag para o seu site.

Adicionando uma seção noscript com uma meta tag de atualização HTML, também é uma boa solução. Eu sugiro que você use esta ferramenta de redirecionamento de JavaScript para criar redirecionamentos. Ele também tem suporte do Internet Explorer para passar o referenciador HTTP.

O código de exemplo sem demora se parece com isto:

<!-- 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 -->

Mas se alguém quiser redirecionar para a página inicial, ele poderá usar o seguinte snippet.

window.location = window.location.host

Seria útil se você tivesse três ambientes diferentes como desenvolvimento, teste e produção.

Você pode explorar essa janela ou objeto window.location apenas colocando essas palavras no Console do Chrome ou no Console do Firebug .


Em JavaScript e jQuery, podemos usar o seguinte código para redirecionar uma página para outra página:

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

O JavaScript fornece vários métodos para recuperar e alterar o URL atual exibido na barra de endereço do navegador. Todos esses métodos usam o objeto Location, que é uma propriedade do objeto Window. Você pode criar um novo objeto Location que tenha o URL atual da seguinte maneira.

var currentLocation = window.location;

Estrutura Básica de um URL

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

  1. Protocolo - Especifica o nome do protocolo a ser usado para acessar o recurso na Internet. (HTTP (sem SSL) ou HTTPS (com SSL))

  2. hostname - nome do host especifica o host que possui o recurso. Por exemplo, www..com. Um servidor fornece serviços usando o nome do host.

  3. port - Um número de porta usado para reconhecer um processo específico para o qual uma mensagem da Internet ou outra rede deve ser encaminhada quando chega a um servidor.

  4. pathname - O caminho fornece informações sobre o recurso específico dentro do host que o Web client deseja acessar. Por exemplo, .com/index.html.

  5. consulta - Uma sequência de consulta segue o componente do caminho e fornece uma sequência de informações que o recurso pode utilizar para algum propósito (por exemplo, como parâmetros para uma pesquisa ou como dados a serem processados).

  6. hash - A parte da âncora de um URL, inclui o sinal de hash (#).

Com essas propriedades do objeto Location, você pode acessar todos esses componentes de URL

  1. hash - configura ou retorna a parte de âncora de um URL.
  2. host -Seta ou retorna o nome do host e a porta de um URL.
  3. hostname -Sets ou retorna o nome do host de um URL.
  4. href - configura ou retorna o URL inteiro.
  5. nome do caminho -Seta ou retorna o nome do caminho de um URL.
  6. port - configura ou retorna o número da porta que o servidor usa para um URL.
  7. protocolo - Configura ou retorna o protocolo de uma URL.
  8. pesquisa -Set ou retorna a parte da consulta de um URL

Agora, se você quiser alterar uma página ou redirecionar o usuário para alguma outra página, você pode usar a propriedade href do objeto Location como este

Você pode usar a propriedade href do objeto Location.

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

Objeto de localização também tem esses três métodos

  1. assign () - Carrega um novo documento.
  2. reload () - Recarrega o documento atual.
  3. replace () - Substitui o documento atual por um novo

Você pode usar os métodos assign () e replace também para redirecionar para outras páginas como estas

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

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

Como assign () e replace () diferem - A diferença entre o método replace () e o método assign () (), é que replace () remove o URL do documento atual do histórico do documento, o que significa que não é possível usar o botão "voltar" para navegar de volta ao documento original. Portanto, use o método assign () se quiser carregar um novo documento e quiser dar a opção de navegar de volta para o documento original.

Você pode alterar a propriedade href do objeto de localização usando jQuery também como este

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

E, portanto, você pode redirecionar o usuário para algum outro URL.


ECMAScript 6 + jQuery, 85 bytes

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

Por favor, não me mate, isso é uma piada. É uma piada. Isso é uma piada.

Isso "forneceu uma resposta para a pergunta", no sentido de que pedia uma solução "usando jQuery" que, nesse caso, implica forçá-lo na equação de alguma forma.

Ferrybig aparentemente precisa da piada explicou (ainda brincando, eu tenho certeza que existem opções limitadas no formulário de revisão), então sem mais delongas:

Outras respostas estão usando attr() do jQuery nos objetos location ou window desnecessariamente.

Esta resposta também abusa, mas de uma maneira mais ridícula. Em vez de usá-lo para definir o local, isso usa attr() para recuperar uma função que define o local.

A função é chamada de jQueryCode mesmo que não exista nada jQuery sobre isso, e chamar uma função de jQueryCode é simplesmente horrível, especialmente quando o algo não é nem mesmo uma linguagem.

Os "85 bytes" são uma referência ao Code Golf. Golfe obviamente não é algo que você deve fazer fora do golfe de código, e além disso esta resposta é claramente não realmente golfed.

Basicamente, encolher.


Antes de começar, o jQuery é uma biblioteca JavaScript usada para manipulação de DOM. Então você não deveria estar usando jQuery para um redirecionamento de página.

Uma citação do Jquery.com:

Embora o jQuery possa ser executado sem grandes problemas em versões de navegadores mais antigos, nós não testamos ativamente o jQuery neles e geralmente não corrigimos os erros que podem aparecer neles.

Foi encontrado aqui: https://jquery.com/browser-support/

Portanto, o jQuery não é uma solução final e ideal para compatibilidade com versões anteriores.

A solução a seguir, que usa JavaScript bruto, funciona em todos os navegadores e é padrão há muito tempo, portanto você não precisa de nenhuma biblioteca para suporte a vários navegadores.

Esta página irá redirecionar para o google.com após 3000 milissegundos

<!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>

Diferentes opções são as seguintes:

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"

Ao usar substituir, o botão Voltar não voltará para a página de redirecionamento, como se nunca estivesse no histórico. Se você quiser que o usuário possa voltar para a página de redirecionamento, use window.location.href ou window.location.assign . Se você usar uma opção que permita ao usuário voltar para a página de redirecionamento, lembre-se de que, ao entrar na página de redirecionamento, ela será redirecionada. Então, ponha isso em consideração ao escolher uma opção para o seu redirecionamento. Sob condições em que a página está apenas redirecionando quando uma ação é feita pelo usuário, a página no histórico do botão voltar ficará bem. Mas, se o redirecionamento automático da página for usado, você deverá usar substituir para que o usuário possa usar o botão Voltar sem ser forçado a voltar para a página que o redirecionamento envia.

Você também pode usar metadados para executar um redirecionamento de página como seguido.

META Refresh

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

META Localização

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

Invasão BASE

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

Muitos outros métodos para redirecionar seu cliente desavisado para uma página que eles podem não querer ir podem ser encontrados nesta página (nenhum deles depende de jQuery):

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

Eu também gostaria de salientar, as pessoas não gostam de ser redirecionadas aleatoriamente. Somente redirecione as pessoas quando for absolutamente necessário. Se você começar a redirecionar as pessoas aleatoriamente, elas nunca mais voltarão ao seu site.

A próxima parte é hipotética:

Você também pode ser denunciado como um site malicioso. Se isso acontecer, quando as pessoas clicarem em um link para o seu site, o navegador do usuário poderá avisá-lo que seu site é malicioso. O que também pode acontecer é que os mecanismos de pesquisa possam começar a perder sua classificação se as pessoas estiverem relatando uma experiência ruim em seu site.

Consulte as diretrizes para webmasters do Google sobre redirecionamentos: https://support.google.com/webmasters/answer/2721217?hl=en&ref_topic=6001971

Aqui está uma pequena página divertida que te tira da página.

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

Se você combinar os dois exemplos de página juntos, você terá um loop infantil de reencaminhamento que garantirá que seu usuário nunca mais desejará usar seu site novamente.


Eu só tive que atualizar esse ridículo com outro método jQuery mais novo:

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

# HTML Page Redirect Usando jQuery / JavaScript

Tente este código de exemplo:

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

Se você quiser fornecer uma URL completa como window.location = "www.google.co.in"; .


Um não redireciona simplesmente usando jQuery

jQuery não é necessário, e window.location.replace(...) irá melhor simular um redirecionamento HTTP.

window.location.replace(...) é melhor que usar window.location.href , porque replace() não mantém a página de origem no histórico da sessão, o que significa que o usuário não ficará preso em um back-end interminável. fiasco botão.

Se você quiser simular alguém clicando em um link, use location.href

Se você quiser simular um redirecionamento HTTP, use location.replace

Por exemplo:

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

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

Você pode redirecionar em jQuery assim:

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

AVISO: Esta resposta foi meramente fornecida como uma solução possível; obviamente não é a melhor solução, pois requer jQuery. Em vez disso, prefira a solução JavaScript pura.

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

Isso funciona com jQuery:

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

Padrão "vanilla" JavaScript maneira de redirecionar uma página:

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

Se você está aqui porque está perdendo HTTP_REFERER ao redirecionar, continue lendo:

A seção a seguir é para aqueles que usam HTTP_REFERER como uma das muitas medidas seguras (embora não seja uma ótima medida de proteção). Se você estiver usando o Internet Explorer 8 ou inferior, essas variáveis ​​serão perdidas ao usar qualquer forma de redirecionamento de página JavaScript (location.href, etc.).

Abaixo, vamos implementar uma alternativa para o IE8 e menor, para que não percamos o HTTP_REFERER. Caso contrário, você quase sempre pode simplesmente usar window.location.href .

Testar contra HTTP_REFERER (colagem de URL, sessão, etc.) pode ser útil para dizer se uma solicitação é legítima. ( Observação: também há maneiras de contornar / falsificar esses referenciadores, conforme observado pelo link de droop nos comentários)

Solução de teste simples entre navegadores (alternativa a window.location.href para o Internet Explorer 9+ e todos os outros navegadores)

Uso: 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; 
    }
}

Existem três maneiras principais de fazer isso

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

e...

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

O último é o melhor, para um redirecionamento tradicional, porque ele não salvará a página que você acessou antes de ser redirecionado em seu histórico de pesquisa. No entanto, se você quiser apenas abrir uma guia com JavaScript, poderá usar qualquer uma das opções acima. 1

EDIT: O windowprefixo é opcional.


Isso funciona para todos os navegadores:

window.location.href = 'your_url';

Basicamente, o jQuery é apenas uma estrutura JavaScript e, para fazer algumas coisas como o redirecionamento , neste caso, você pode simplesmente usar JavaScript puro, então, nesse caso, você tem 3 opções usando JavaScript vanilla:

1) Usando a substituição de local, isso substituirá o histórico atual da página, o que significa que não é possível usar o botão Voltar para retornar à página original.

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

2) Usando a localização atribuída , isso manterá o histórico para você e, usando o botão voltar, você poderá voltar para a página original:

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

3) Eu recomendo usar uma dessas formas anteriores, mas esta poderia ser a terceira opção usando JavaScript puro:

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

Você também pode escrever uma função no jQuery para lidar com isso, mas não é recomendado, pois é apenas uma linha de função JavaScript pura, você também pode usar todas as funções acima sem janela se você já estiver no escopo da janela, por exemplo window.location.replace("http://.com"); poderia ser location.replace("http://.com");

Também mostro todos eles na imagem abaixo:


Usar:

// 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')

Na sua função de clique, basta adicionar:

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

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

Você pode fazer isso sem jQuery como:

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

E se você quiser apenas o jQuery, você pode fazer como:

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






redirect