使用ajax在IFRAME中加载页面
[英]Load the page inside of IFRAME using ajax
问题描述
如何使用IFRAME加载页面？ 我在想这是否可能..
例如，我在下面有这个iframe。
<iframe id="iframe" width="1024" height="600" src="http://www.sample.com"></iframe>
我希望www.sample.com页面加载到这个iframe中，而不是简单地将URL添加到src属性中，而是使用ajax获取当前页面数据并使用IFRAME标记加载。 我正在考虑这个问题，因为我在大多数时候都在IFRAME缓存上遇到了很大的问题。
我也试过这个东西但是，它在我的结尾并不完美。
<iframe id="iframe" width="1024" height="600" src="http://www.sample.com?random=1422841682605""></iframe>
每次加载这个iframe时随机都会改变。
我想将它应用于我的响应工具，如下图所示。 如果您需要实际视图， 请单击此处 。
谢谢你们，如果有一些想法那里。
4 个解决方案
解决方案1
5 2015-02-02 02:40:17
您仍然可以使用src，但提供如下所示的数据URL：
src = 'data:text/html;charset=utf-8,' +
encodeURIComponent( // Escape for URL formatting
'<!DOCTYPE html>'+
'<html lang="en">'+
'<body><h1>Another document!</h1></body>'+
'</html>'
);
解决方案2
2 2015-02-02 02:26:11
您可以使用几种不同的方法使用Javascript更改iframe的位置。
var frame = document.getElementById("iframe");
frame.src = "http://www.sample.com";
frame.contentWindow.location = "http://www.sample.com";
frame.contentWindow.open("http://www.sample.com");
当然，你必须非常小心iframe。 如果iframe指向外部域（即：“Cross-Origin”，即：不是托管主网页的同一域），则会违反浏览器安全策略，如果您尝试操作/读取许多内容，则会抛出错误属性。
另请注意，通过更改iframe元素的src属性，iframe将自动转到新位置。 但是，如果您使用我建议的其他两种方法之一，iframe元素的src属性将不会更改（即使iframe的内容指向新位置）。
如果您需要获取iframe的位置，可以尝试：
iframe.contentWindow.location.href;
但是，如果iframe指向不在同一域上托管的站点，则会再次导致错误。 为安全起见，请使用try {} catch (e) {}块。
解决方案3
1 2015-02-02 02:28:38
确保在链接前使用“http：//”，例如：
<iframe src="http://www.google.com"></iframe>
解决方案4
1 2015-02-02 02:37:00
如果www.sample.com位于同一个域中，您可以这样做：
<div id = "targetDiv"></div>
<script>
$('document').ready(function() {
$('#targetDiv').load('www.sample.com');
});
</script>
但是，如果它是同一个域，你可能会使用.load('/');
使用ajax在iframe中加载内容
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.