大概是页面载入js事件执行顺序或者jquery异步出的问题，很伤脑筋的问题

Question

我的a.htm页面包含一个<iframe id="father" src="b.htm">
b.htm包含<iframe id="child" >我希望把b包装成一个重用性强的控件，所以基本a，b，c三个页面的操作都在b中完成。
现在的问题是这样的，b中包含三部分代码：
//设置father这个iframe的大小自适应
$(window.frameElement).load(function() {     
        var main = $(window.frameElement);
        var thisheight = $(document).height();
        var thiswidth = $(document).width();
        main.height(thisheight);
        main.width(thiswidth);
    });//设置child这个iframe的大小自适应
    $("#child").load(
        function() {
            var iframe = document.getElementById("child");
            iframe.height = iframe.contentWindow.document.documentElement.scrollHeight;
            iframe.width = iframe.contentWindow.document.documentElement.scrollWidth;
        }
    );
//设置child这个iframe的src参数
$(document).ready(function(){$("#child").attr("src","c.htm")});
这样写出来外层的iframe无法大小自适应，调试时三部分代码执行的顺序是 先jquery的ready事件，然后是father.load，最后child.load。但如果我ready里不动态更改属性，而是在页面标签直接写入src,<iframe id=child src="c.htm"></iframe> 这样father就可以自动调整适合的大小。各位大牛，这是怎么回事啊，迷茫中。。

Answer 1

动态加载iframe需要判断的~·得判断iframe是否load完毕，也就是iframe加载的页面是否加载好。如果没有加载好，肯定是不能用js操作的。你直接把标签写在页面上是可以的~·

Answer 2

http://gaojianzhuang110.blog.163.com/blog/static/186131462010112441642578/楼主具体看看这个

Answer 3

1 iframe.height=.. iframe.width = ... 为何不是 iframe.style.height = ... iframe.style.width = ...2 child的中的页面可否在onload中写回调函数 parent.xxx()来处理  iframe.style.height （width）

Answer 4

怎么在onload中写回调函数来处理，能例举少量源代码吗？

Answer 5

b.html中:
function adj(){
    var iframe = document.getElementById("child");
    iframe.style.height = iframe.contentWindow.document.documentElement.scrollHeight;
    iframe.style.width = iframe.contentWindow.document.documentElement.scrollWidth;
}child的页面中
window.onload = function(){
    parent.adj();
}

Answer 6

不行啊老大，还是一样的效果。有没有办法让它很早就获取到url或者保证让它加载完以后再执行大小自适应啊？

Answer 7

iframe.contentWindow.document.documentElement.scrollHeight 的值输出看看对不对
child的页面中window.onload里可以确保child加载完了 

Answer 8

iframe.contentWindow.document.documentElement.scrollHeight这个值是iframe不设值时的默认大小，我在想也许是这样一个问题，因为iframe标签本来存在，所以一开始就加载完了，但是src是后面通过attr函数设进去的，所以这时开始实际页面加载还需要时间，自适应大小就在实际页面加载完成之前运行了，就得到了iframe默认大小。。

Answer 9

用 $('#child').load()是 不行的，这个是iframe本身加载，不是iframe内的内容的加载。
而 child内window.onload是可以保证内容加载完成的

Answer 10

以下测试可以<iframe id="child"></iframe>
<script>
function adj(){
var f = document.getElementById("child");
f.style.height = f.contentWindow.document.body.scrollHeight;
f.style.width = f.contentWindow.document.body.scrollWidth;
}
window.onload=function(){
var f = document.getElementById("child");
f.contentWindow.location.href = "test4.asp";
}
</script>
test4.asp<div style="background:red;width:700px;height:600px"></div>
<script>
window.onload=function(){
parent.adj();
}
</script>

Answer 11

但是我仅仅用$('#child').load()加载的iframe的大小，内容加载是在$(document).ready()里面完成的啊，要不然你有空的话我给你发代码你帮我看看吧？

Answer 12

刚刚调试了一下有个新发现，当src直接写在标签里的时候会先执行child.load  然后再father.load这样效果是正确的，如果不写src而是attr来设置，则先执行father.load 再child.load ，而father的大小是根据child来设置的，所以此时father设置错误。 有什么办法吗？

Answer 13

晕用了个笨办法弄出来了，child.load里先自适应child再自适应father。。非常感谢你得提示！