我有两个网站 A.com 和 B.com。我必须将 B.com 嵌入到 A.com 的 iframe 中。我无法在 B.com 进行任何更改
B.com 仅适用于带有一些发布数据的发布请求。我的工作如下
<!--This is the div inside which I will embedd the iframe-->
<div id="frameDiv"></div>
<script type="text/javascript">
//Create iframe
var $ifr = $('<iframe name="myFrame" id="myFrame"></iframe>');
//create form
var $form = $('<form action="B.com" method="post" target="myFrame"></form>');
//Append hidden field to form to pass postData
$form.append($('<input type="hidden" name="dataName"><input>').val('data'));
//Append form to the iframe and then append iframe to the div
$('#frameDiv').append($ifr.append($form));
$form.submit();
</script>
现在,B.com 可以完美地加载到 iframe 中以响应发布请求。但是 B.com 很慢。我想在 #frameDiv 内显示一个微调器,直到加载 iframe。我该怎么做?
这是我试过的:
$('#frameDiv').append($spinnerImage)
//Does not work, fires immediately
$ifr.load(function(){
//Hide the spinner image
});
//Does not work, fires immediately
$ifr.ready(function(){
//Hide the spinner image
});
如果 B.Com 是一个简单的 get 并被设置为 iframe 的 src 属性,jQuery load 方法就可以做到这一点。但在这种情况下它不会。
感谢任何帮助:)
最佳答案
@charlietfl 的回答是正确的,而且有效。我只是想分享我发现的另一种方法。
只需将 iframe 的背景设置为微调框 :)
#myFrame
{
background-image: url('/content/images/spinner.gif');
background-repeat: no-repeat;
}
当 B.com 加载时,新文档会隐藏微调器..
知道哪种方法是首选吗??
关于javascript - 显示微调器,直到 iframe 加载了 http post 响应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11182083/