Redirecionar a janela pai de uma ação iframe


312

Qual JavaScript eu preciso usar para redirecionar uma janela pai de um iframe?

Quero que eles cliquem em um hiperlink que, usando JavaScript ou qualquer outro método, redirecione a janela pai para um novo URL.


5
A janela principal , por si só, também pode ser uma IFrame. Como a resposta aceita aborda a janela superior , sugiro que você altere um pouco sua pergunta.
Ron Klein

Respostas:


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

Como afirmado anteriormente, redirecionará o iframe pai.


Eu não acho que a mesma política de origem se aplica aqui. Faz sentido que você consiga quebrar seu site do iframe de outra pessoa.
Brian McAuliffe 25/09

1
No Chrome, o @Parris jsfiddle gera esse erro: Tentativa de JavaScript insegura para iniciar a navegação do quadro com o URL ' jsfiddle.net/ppkzS ' do quadro com o URL ' parrisstudios.com/tests/iframe_redirect.html '. O quadro que está tentando navegar na janela de nível superior está na caixa de areia, mas o sinalizador 'permitir navegação superior' não está definido.
Bjarte Aune Olsen /

1
@BjarteAuneOlsen interessante, pode ser uma alteração recente no chrome ou no webkit. Definitivamente estava funcionando anteriormente. Já faz alguns anos :). Também a resposta costumava indicar a mesma política de origem aplicada, que anteriormente tornava a resposta incorreta, mas agora a torna correta e meu comentário está errado -_-.
Parris

4
@BjarteAuneOlsen - Eu acredito que isso ocorre porque os Iframes no JSFiddle estão deliberadamente em área restrita, por isso negaram explicitamente certos recursos (como redirecionamento etc.) - existe o perigo de você usar o JS para navegar para longe do JS Fiddle e perder seu trabalho. ..
Zhaph - Ben Duguid

11
Os erros que as pessoas estão encontrando aqui se devem a um novo atributo HTML5 para iframes chamado " sandbox" - developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe O sandboxatributo impede que o javascript execute determinadas ações em um iframe com base em em uma determinada lista de permissões de ações permitidas. A allow-top-navigationpropriedade é uma das ações que você pode ativar na lista de permissões, que permite que esse código funcione. Se o sandboxatributo for ausente, todas as ações serão permitidas. Se estiver presente e uma sequência vazia, todas as ações serão negadas.
Marcus Harrison

115

Descobri que <a href="..." target="_top">link</a>funciona também


7
Embora a resposta selecionada esteja correta, acho que essa é uma resposta melhor para a intenção da pergunta. Além disso, ele funcionará para as pessoas que têm o JS desativado.
Michael - Onde está Clay Shirky

Concordo que esta é a melhor solução, mas o OP pediu especificamente javascript. Por outro lado, o OP especificou que deveria ser acionado por meio de uma âncora - não consigo ver um cenário em que alguém seria forçado a usar o javascript de uma marca de âncora para alcançar o resultado desejado; portanto, a pergunta é enganosa.
Nocarrier

2
Tão simples e elegante. Funciona como charme :)
Yash

54
window.top.location.href = "http://example.com";

window.top refere-se ao objeto de janela da página na parte superior da hierarquia de quadros.


9
A propriedade window.top.location.href não pode ser atualizada no Iframe, ele lança a execução negada pelo acesso. Ela só pode ser executado quando você está testando em localhost
Muhammad Ummar

4
@Ummar: Gostaria de acrescentar que isso funciona quando o pai de um iframe tem mesmo domínio, mesma porta (políticas mesma origem), ele lança acesso negado exceção quando eles são diferentes, para evitar violações de segurança
Quan Mai

5
@Ummar isso não é verdade, jsfiddle.net/ppkzS como prova. Você pode alterar window.top.location.href. Você simplesmente não consegue ler. Funciona em cromo.
Par13

Grande jsFiddle @Parris, isso encerra o assunto para me :)
Max Williams

2
Eu suspeito que alguns dos que duvidam possam ter tentado algo assim no iframe: window.top.location.href = window.top.location.href ;
Mjj1409


15

target="_parent"funcionou muito bem para mim. fácil e sem complicações!


Isso parece funcionar muito bem. Existem desvantagens em usar esse método em vez de Javascript?
flyingL123

não que eu saiba. Compartilhe se você descobrir alguma coisa.
RDroid # 21/15

7

O @MIP está certo, mas com as versões mais recentes do Safari, você precisará adicionar o atributo sandbox (HTML5) para fornecer acesso de redirecionamento ao iFrame. Existem alguns valores específicos que podem ser adicionados com um espaço entre eles.

Referência (você precisará rolar): https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe

Ex:

<iframe sandbox="allow-top-navigation" src="http://google.com/"></iframe>

Observe que o sandboxatributo permite um conjunto extra de restrições para o conteúdo no <iframe>. O valor da sandboxpropriedade remove restrições específicas. Portanto, tenha cuidado ao usar esse recurso. w3schools.com/tags/att_iframe_sandbox.asp
gitaarik

3

Isso resolverá a miséria.

<script>parent.location='http://google.com';</script>

3

Se você deseja redirecionar para outro domínio sem que o usuário precise fazer alguma coisa, use um link com a propriedade:

target="_parent"

como dito anteriormente e, em seguida, use:

document.getElementById('link').click();

para redirecionar automaticamente.

Exemplo:

<!DOCTYPE HTML>

<html>

<head>

</head>

<body>

<a id="link" target="_parent" href="outsideDomain.html"></a>

<script type="text/javascript">
    document.getElementById('link').click();
</script>

</body>

</html>

Nota: O comando javascript click () deve vir depois que você declara o link.


1

É possível redirecionar de um iframe, mas não obter informações do pai.


0

Tente usar

window.parent.window.location.href = 'http://google.com'

Versão simples: parent.window.location = '<URL>';
Shasi kanth

1
ou mais simplificado:parent.location = 'url'
grilly


-2

Temos que usar window.top.location.href para redirecionar a janela pai de uma ação iframe.

URL de demonstração :


1
Quem somos nós? :) Você poderia escrever as partes essenciais do URL na resposta, por favor? URLs / links podem mudar ou serem excluídos.
YesThatIsMyName

-8

Redirecione iframe na janela pai por iframe no mesmo pai:

window.parent.document.getElementById("content").src = "content.aspx?id=12";
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.