我有一个简单的 HTML ( Home.html
),它有一个iframe
. 这iframe
用于显示页面Grid.aspx
。一切正常,但我的组织不允许在iframe
这个项目中使用 。管理安装了 IIS 的服务器的 IT 部门不希望我使用它们。
我可以使用 adiv
或其他元素代替吗?
这是我的 html,其中包含我需要替换的 IFrame 以及我用来在该 IFrame 中加载内容的当前 JavaScript:
<html class="no-js" lang="">
<head>
</head>
<body>
<div id="storeTable" style="width: 900px; height: 200px;">
<iframe id="retailframe" src="" width="900px" height="800px" scrolling="no" allowTransparency="true" frameborder="0" ></iframe>
</div>
<input type="button" value="Capacity Chart" onclick="CapacityChart();">
<script>
function CapacityChart()
{
var doc = document.getElementById('retailframe').contentWindow.document;
doc.open();
doc.write('Test');
doc.close();
var storeSite = "http://10.12.34.83:88/Grid.aspx";
var store = document.getElementById('retailframe');
store.src = storeSite;
}
</script>
</body>
</html>
如何在 div 中加载 Grid.aspx 的内容?
相反,在页面加载到的iframe
,你可以使一个AJAX调用服务器,并采取响应(页面的内容),并将其加载到任何你喜欢的元素。但是,AJAX 调用存在安全问题,并且根据您要连接的站点,您可能无法执行此操作。
<html class="no-js" lang="">
<head>
</head>
<body>
<div id="storeTable" style="width: 900px; height: 200px;"></div>
<input type="button" value="Capacity Chart" onclick="CapacityChart();">
<script>
// Create instance of XHR to make AJAX call with:
var xhr = new XMLHttpRequest();
// Configure the component to make the call:
xhr.open("GET", "http://10.12.34.83:88/Grid.aspx");
// Set up an event handler that will fire as the call moves through its various stages
xhr.addEventListener("readystatechange", function(){
// If the response has been recieved
if(xhr.readyState === 4){
// And the status is "OK"
if(xhr.status === 200){
// Inject the results into the container of choice:
document.getElementById("storeTable").innerHTML = xhr.responseText;
} else {
console.log("Problem getting data");
}
}
});
xhr.send(); // Make the call
</script>
</body>
</html>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句