Thay thế nội dung của cửa sổ _top bằng nội dung iframe mà không cần tải lại trang

Có thể thay thế nội dung của cửa sổ trình duyệt (khung _top) bằng tài liệu được tải trong khung nội tuyến mà không đưa ra GET mới để tải tài liệu đó không?Thay thế nội dung của cửa sổ _top bằng nội dung iframe mà không cần tải lại trang

Something như thế này:

<html> 
<head> 
<script type="text/javascript" language="JavaScript"> 
$(document).ready(function() { 
    $("#link").click(function() { 
    // should present in the browser window the content of the iframe WITHOUT reload 
    // even preserve javascript/head code 
    $(document).html($("#frameDestination").html()); 
    }); 
}); 
</script> 
</head> 
<body> 
<a id="link" href="#">full window</a> 
<iframe id="frameDestination" src="http://www.some-random-site.com" width="900px" height="500px"></iframe> 
</body> 
</html>

Nguồn

2013-01-24 Gabriel Belingueres

Hãy để tôi đảm bảo chúng tôi hiểu vấn đề chính xác: Bạn có một trang có thẻ liên kết và khung nội tuyến. Khi nhấp vào thẻ liên kết, bạn muốn toàn bộ trang trở thành nội dung trong iframe (không thực hiện bất kỳ yêu cầu HTTP nào)? – jbabey

Tôi không thể nghĩ ra bất kỳ cách nào có thể xảy ra. Có thể định vị lại khung nội tuyến để che toàn bộ cửa sổ trình duyệt, nhưng nó vẫn sẽ được lồng trong trang gốc. – Blazemonger

@jbabey Chính xác! Tôi muốn mô phỏng như thể trang được tải bằng cách nhập vào URL trong thanh địa chỉ của trình duyệt. Tôi không muốn một roundtrip mới cho máy chủ yêu cầu cho cùng một tài liệu HTML vì nó đã được tải trong khung nội tuyến. –

Sử dụng nội dung() khi làm việc với một khung nội tuyến trong jQuery.

$("#YourIframe").contents().find("html").html();

Đây là chỉ sẽ hoạt động nếu iframe là trong cùng miền như phụ huynh.

Nguồn

2013-01-24 16:19:23 epascarello

tôi đã không kiểm tra miền chéo, nhưng trên cùng một tên miền Tôi có kịch bản này làm việc:

$(document).ready(function() { 
    $("#link").click(function() { 
    var iframeBody = document.getElementById("frameDestination").contentDocument, 
    head = iframeBody['head'].innerHTML, 
    body = iframeBody['body'].innerHTML; 
    $('body').html(body); 
    $('head').html(head); 
    }); 
});

Trong Firefox mới nhất, tôi thậm chí có thể thiết lập một biến trong một thẻ script trong và xem giá trị đó trong _top sau khi nhấp vào liên kết.

Nguồn

2013-01-24 16:26:16 Rustavore

Cảm ơn @Gitninja! Nó hoạt động giống như một sự quyến rũ cho cùng một tên miền, nhưng chỉ thử nghiệm nó với một tên miền khác và không hoạt động (FF và Chrome). –

Tôi đã đọc rằng nếu iframe src được đặt bởi javascript, thì giới hạn miền chéo không áp dụng, nhưng tôi chưa thử nghiệm. Bạn có thể tự động tạo thẻ iframe bằng javascript trong situtation của mình không? – Rustavore

@Gitnija: Không hoạt động với: 'var ifrm = document.createElement (" IFRAME "); ifrm.setAttribute ("src", "http://www.somesite.com"); ifrm.setAttribute ("id", "frameDestination"); ifrm.style.width = 1200+ "px"; ifrm.style.height = 500+ "px"; document.body.appendChild (ifrm); ' –

Thay thế nội dung của cửa sổ _top bằng nội dung iframe mà không cần tải lại trang

Trả lời

Các vấn đề liên quan