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.


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.


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


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.


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

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


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>

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>

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.


1

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


0

Coba gunakan

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

Versi sederhana: parent.window.location = '<URL>';
shasi kanth

1
atau lebih lanjut disederhanakan:parent.location = 'url'
grilly


-2

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

URL demo :


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";
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.