Arahkan jendela induk dari tindakan iframe

312

JavaScript apa yang harus saya gunakan untuk mengarahkan ulang jendela induk dari iframe?

Saya ingin mereka mengklik hyperlink yang, menggunakan JavaScript atau metode lain, akan mengarahkan jendela induk ke URL baru.

javascript iframe dhtml Klik Upvote
sumber
5
The orangtua jendela, dalam dirinya sendiri, bisa menjadi IFramejuga. Karena jawaban yang diterima membahas jendela teratas , saya sarankan Anda sedikit mengubah pertanyaan Anda.
Ron Klein

Jawaban:

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

Seperti yang dinyatakan sebelumnya, akan mengarahkan ulang iframe induk.

MIP
sumber
Saya tidak berpikir kebijakan asal yang sama berlaku di sini. Masuk akal bahwa Anda harus dapat memecah situs Anda dari iframe orang lain.
Brian McAuliffe
1
Di Chrome, @Parris jsfiddle melakukan kesalahan ini: JavaScript yang tidak aman mencoba memulai navigasi untuk bingkai dengan URL ' jsfiddle.net/ppkzS ' dari bingkai dengan URL ' parrisstudios.com/tests/iframe_redirect.html '. Bingkai yang mencoba navigasi dari jendela tingkat atas adalah kotak pasir, tetapi bendera 'bolehkan navigasi atas' tidak disetel.
Bjarte Aune Olsen
1
@BjarteAuneOlsen menarik, mungkin perubahan terbaru di chrome atau webkit. Itu pasti bekerja sebelumnya. Sudah beberapa tahun :). Juga jawaban yang digunakan untuk menyatakan bahwa kebijakan asal yang sama diterapkan, yang sebelumnya membuat jawaban salah, tetapi sekarang membuatnya benar dan komentar saya salah -_-.
Parris
4
@BjarteAuneOlsen - Saya percaya ini adalah karena Iframe pada JSFiddle sengaja Sandbox sehingga mereka telah secara eksplisit membantah fitur tertentu (seperti redirect, dll) - ada bahaya bahwa Anda akan menggunakan JS untuk menavigasi dari JS Fiddle dan kehilangan pekerjaan Anda. ..
Zhaph - Ben Duguid
12
Kesalahan orang yang menghadapi sini adalah karena atribut HTML5 baru untuk iframe disebut, " sandbox" - developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe yang sandboxmencegah atribut JavaScript mengambil tindakan tertentu dalam iframe berdasarkan pada daftar putih yang diberikan tindakan yang diizinkan. The allow-top-navigationproperti adalah salah satu tindakan Anda dapat mengaktifkan dalam daftar putih, yang memungkinkan kode ini bekerja. Jika sandboxatribut tidak ada, semua tindakan diizinkan. Jika ada dan string kosong, semua tindakan ditolak.
Marcus Harrison
115

Saya menemukan itu <a href="..." target="_top">link</a>bekerja juga

Klik Upvote
sumber
7
Meskipun jawaban yang dipilih benar, saya pikir ini adalah jawaban yang lebih baik untuk maksud pertanyaan itu. Juga, ini akan bekerja untuk orang-orang yang memiliki JS dinonaktifkan.
Michael - Di mana Clay Shirky
Saya setuju ini adalah solusi terbaik tetapi OP secara khusus meminta javascript. Di sisi lain, OP menentukan itu harus dipicu melalui jangkar - Saya tidak bisa melihat skenario di mana orang akan dipaksa untuk menggunakan javascript dari tag jangkar untuk mencapai hasil yang diinginkan, karena itu pertanyaannya menyesatkan.
nocarrier
2
Sangat sederhana dan elegan. Bekerja seperti pesona :)
Yash
54 
window.top.location.href = "http://example.com";

window.top merujuk ke objek jendela halaman di bagian atas hirarki frame.

Luca Matteis
sumber
9
properti window.top.location.href tidak dapat diperbarui dari Iframe, itu membuang akses yang ditolak eksekusi. Ini hanya dapat dieksekusi ketika Anda menguji pada localhost
Muhammad Ummar
4
@Ummar: Saya akan menambahkan bahwa ini berfungsi ketika orang tua dan iframe memiliki domain yang sama, port yang sama (kebijakan asal yang sama), ia melempar pengecualian yang ditolak akses ketika mereka berbeda, untuk mencegah pelanggaran keamanan
Quan Mai
5
@Ummar itu tidak benar, jsfiddle.net/ppkzS sebagai bukti. Anda dapat mengubah window.top.location.href. Anda tidak bisa membacanya. Bekerja di chrome.
Parris
Great jsfiddle @ Parris, itu cocok untuk saya :)
Max Williams
2
Saya menduga beberapa orang yang ragu mungkin telah mencoba sesuatu seperti ini di dalam iframe: window.top.location.href = window.top.location.href ;
mjj1409
15

atau alternatifnya adalah sebagai berikut (menggunakan objek dokumen)

parent.document.location.href = "http://example.com";
Merah asli.
sumber
5
Solusi itu khusus untuk Firefox. Orang hanya harus menggunakan parent.location.href = .... developer.mozilla.org/en/document.location
kay - SE jahat
15

target="_parent"bekerja sangat baik untuk saya. mudah dan tidak merepotkan!

rDroid
sumber
Ini sepertinya bekerja dengan baik. Apakah ada kelemahan menggunakan metode ini daripada Javascript?
flyingL123
tidak yang saya tahu. Berbagilah jika Anda menemukan sesuatu.
rDroid
7

@MIP benar, tetapi dengan versi Safari yang lebih baru, Anda perlu menambahkan atribut sandbox (HTML5) untuk memberikan akses pengalihan ke iFrame. Ada beberapa nilai spesifik yang dapat ditambahkan dengan spasi di antara mereka.

Referensi (Anda perlu menggulir): https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe

Ex:

<iframe sandbox="allow-top-navigation" src="http://google.com/"></iframe>
Raymond B
sumber
Perhatikan bahwa sandboxatribut ini memungkinkan satu set ekstra pembatasan untuk konten dalam <iframe>. Nilai sandboxproperti menghilangkan batasan tertentu. Jadi hati-hati dengan menggunakan fitur ini. w3schools.com/tags/att_iframe_sandbox.asp
gitaarik
3

Ini akan menyelesaikan kesengsaraan.

<script>parent.location='http://google.com';</script>
Ali Haris
sumber
3

Jika Anda ingin mengalihkan ke domain lain tanpa pengguna harus melakukan apa pun, Anda dapat menggunakan tautan dengan properti:

target="_parent"

seperti yang dikatakan sebelumnya, dan kemudian gunakan:

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

untuk mengarahkan secara otomatis.

Contoh:

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

Catatan: Perintah klik javascript () harus datang setelah Anda mendeklarasikan tautan.

Tom Burris
sumber
1

Dimungkinkan untuk mengalihkan dari iframe, tetapi tidak untuk mendapatkan informasi dari orang tua.

Joris Kok
sumber
0

Coba gunakan

window.parent.window.location.href = 'http://google.com'
Chirag Gohel
sumber
Versi sederhana: parent.window.location = '<URL>';
shasi kanth
1
atau lebih lanjut disederhanakan:parent.location = 'url'
grilly
0 
window.top.location.href = 'index.html';

Ini akan mengarahkan ulang jendela utama ke halaman indeks. Terima kasih

dnts2012
sumber
Gandakan jawaban ini dari hampir 5 tahun sebelumnya.
Michael - Di mana Clay Shirky
-2

Kita harus menggunakan window.top.location.href untuk mengarahkan ulang jendela induk dari tindakan iframe.

URL demo :

Faizal
sumber
1
Siapa kami? :) Bisakah Anda menulis bagian-bagian penting dari url ke dalam jawabannya? URL / tautan dapat berubah atau dihapus.
YesThatIsMyName
-8

Redirect iframe di jendela induk dengan iframe di induk yang sama:

window.parent.document.getElementById("content").src = "content.aspx?id=12";
mohamed moren3
sumber