Chuyển hướng cửa sổ cha mẹ từ một hành động iframe


312

Tôi cần sử dụng JavaScript nào để chuyển hướng cửa sổ cha mẹ từ iframe?

Tôi muốn họ nhấp vào một siêu liên kết, sử dụng JavaScript hoặc bất kỳ phương thức nào khác, sẽ chuyển hướng cửa sổ cha mẹ sang một URL mới.


5
Các mẹ cửa sổ, trong chính nó, có thể là một IFrame, quá. Vì câu trả lời được chấp nhận giải quyết cửa sổ trên cùng , tôi khuyên bạn nên thay đổi câu hỏi của mình một chút.
Ron Klein

Câu trả lời:


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

Như đã nêu trước đây, sẽ chuyển hướng iframe cha.


Tôi không nghĩ rằng chính sách xuất xứ tương tự áp dụng ở đây. Điều có ý nghĩa là bạn sẽ có thể tách trang web của mình ra khỏi iframe của người khác.
Brian McAuliffe

1
Trong Chrome, @Parris jsfiddle đưa ra lỗi này: JavaScript không an toàn để bắt đầu điều hướng cho khung bằng URL ' jsfiddle.net/ppkzS ' từ khung có URL ' parrisstudios.com/tests/iframe_redirect.html '. Khung điều hướng cố gắng của cửa sổ cấp cao nhất được đóng hộp cát, nhưng cờ 'cho phép điều hướng trên cùng' không được đặt.
Bjarte Aune Olsen

1
@BjarteAuneOlsen thú vị, có thể là một thay đổi gần đây trong chrome hoặc webkit. Nó chắc chắn đã hoạt động trước đây. Nó đã được một vài năm :). Ngoài ra, câu trả lời được sử dụng để nêu chính sách nguồn gốc tương tự được áp dụng, trước đây đã trả lời sai, nhưng bây giờ làm cho nó đúng và nhận xét của tôi sai -_-.
Parris

4
@BjarteAuneOlsen - Tôi tin rằng điều này là do các Iframes trên JSFiddle được cố tình đóng hộp cát nên họ đã từ chối một cách rõ ràng các tính năng nhất định (như chuyển hướng, v.v.) - có một nguy cơ là bạn sẽ sử dụng JS để điều hướng khỏi JS Fiddle và mất công việc của bạn. ..
Zhaph - Ben Duguid

10
Các lỗi mọi người đang gặp phải ở đây là vì một thuộc tính HTML5 mới cho iframe gọi, " sandbox" - developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe Các sandboxngăn chặn thuộc tính JavaScript có những hành động nhất định trong một khung nội tuyến dựa trên một danh sách trắng cho các hành động được phép. Các allow-top-navigationbất động sản là một trong những hành động mà bạn có thể kích hoạt trong danh sách trắng, cho phép mã này để làm việc. Nếu sandboxthuộc tính vắng mặt, tất cả các hành động được cho phép. Nếu nó có mặt và một chuỗi rỗng, tất cả các hành động đều bị từ chối.
Marcus Harrison

115

Tôi thấy rằng nó <a href="..." target="_top">link</a>cũng hoạt động


7
Mặc dù câu trả lời được chọn là chính xác, tôi nghĩ đây là câu trả lời tốt hơn cho mục đích của câu hỏi. Ngoài ra, nó sẽ hoạt động cho những người bị vô hiệu hóa JS.
Michael - Clay Shirky ở đâu

Tôi đồng ý đây là giải pháp tốt nhất nhưng OP đặc biệt yêu cầu javascript. Mặt khác, OP đã chỉ định nó nên được kích hoạt thông qua một neo - Tôi không thể thấy một kịch bản trong đó người ta sẽ buộc phải sử dụng javascript từ thẻ neo để đạt được kết quả mong muốn, do đó câu hỏi là sai.
nocarrier

2
Thật đơn giản và thanh lịch. Hoạt động như bùa mê :)
Yash

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

window.top đề cập đến đối tượng cửa sổ của trang ở đầu phân cấp khung.


9
Thuộc tính window.top.location.href không thể được cập nhật từ Iframe, nó ném quyền truy cập bị từ chối thực thi. Nó chỉ có thể được thực thi khi bạn đang thử nghiệm trên localhost
Muhammad Ummar

4
@Ummar: Tôi sẽ thêm rằng điều này hoạt động khi cha mẹ của iframe có cùng tên miền, cùng một cổng (cùng chính sách xuất xứ), nó ném quyền truy cập bị từ chối khi chúng khác nhau, để ngăn chặn vi phạm an ninh
Quan Mai

5
@Ummar không đúng, jsfiddle.net/ppkzS làm bằng chứng. Bạn có thể thay đổi window.top.location.href. Bạn không thể đọc nó. Hoạt động trong chrome.
Parris

Tuyệt vời jsfiddle @Parris, giải quyết nó cho tôi :)
Max Williams

2
Tôi nghi ngờ một số nghi ngờ có thể đã thử một cái gì đó như thế này trong iframe: window.top.location.href = window.top.location.href ;
mjj1409


15

target="_parent"làm việc tuyệt vời cho tôi dễ dàng và rắc rối miễn phí!


Chúng dường như làm việc tuyệt vời. Có bất kỳ nhược điểm nào khi sử dụng phương pháp này hơn là Javascript không?
bayL123

Không phải là tôi biết. NÊN chia sẻ nếu bạn tìm ra điều gì đó.
rDroid

7

@MIP đúng, nhưng với các phiên bản Safari mới hơn, bạn sẽ cần thêm thuộc tính hộp cát (HTML5) để cấp quyền truy cập vào iFrame. Có một vài giá trị cụ thể có thể được thêm vào bằng khoảng trắng giữa chúng.

Tham khảo (bạn sẽ cần cuộn): https://developer.mozilla.org/en-US/docs/Web/HTML/Euity/iframe

Ví dụ:

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

Lưu ý rằng sandboxthuộc tính cho phép thêm một bộ hạn chế cho nội dung trong <iframe>. Giá trị của sandboxtài sản loại bỏ các hạn chế cụ thể. Vì vậy, xem ra với việc sử dụng tính năng này. w3schools.com/tags/att_iframe_sandbox.asp
gitaarik

3

Điều này sẽ giải quyết sự khốn khổ.

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

3

Nếu bạn muốn chuyển hướng đến một tên miền khác mà không cần người dùng phải làm bất cứ điều gì bạn có thể sử dụng một liên kết với tài sản:

target="_parent"

như đã nói trước đó, và sau đó sử dụng:

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

để nó tự động chuyển hướng.

Thí dụ:

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

Lưu ý: Lệnh javascript click () phải xuất hiện sau khi bạn khai báo liên kết.


1

Có thể chuyển hướng từ iframe, nhưng không nhận được thông tin từ cha mẹ.


0

Hãy thử sử dụng

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

Phiên bản đơn giản: Parent.window.location = '<URL>';
shasi kanth

1
hoặc đơn giản hóa hơn nữa:parent.location = 'url'
grilly


-2

Chúng ta phải sử dụng window.top.location.href để chuyển hướng cửa sổ cha mẹ từ một hành động iframe.

Url demo :


1
Chúng ta là ai? :) Bạn có thể viết các phần thiết yếu từ url vào câu trả lời không? URL / liên kết có thể thay đổi hoặc bị xóa.
CóThatIsMyName

-8

Chuyển hướng iframe trong cửa sổ cha theo iframe trong cùng cha mẹ:

window.parent.document.getElementById("content").src = "content.aspx?id=12";
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.