Detect IFrame Load Event 探索Iframe的加载事件

 

sleep 2秒后显示结果

 

<script type="text/javascript">
        Ext.onReady(function () {
            Ext.widget('panel', {
                title: 'My Slow Iframe',
                width: 300,
                height: 300,
                items: {
                    xtype: 'component',
                    autoEl: {
                        tag: 'iframe',
                        style: 'height:100%;width:100%;border:none;',
                        src: 'a.ashx'
                    },
                    listeners: {
                        load: {
                            element: 'el',
                            fn: function () {
                                this.parent().unmask();
                            }
                        },
                        render: function () {
                            this.up('panel').body.mask('Loading...');
                        }
                    }
                },
                renderTo:document.body
            });
        });
    </script>

 

 a.ashx页面

<%@ WebHandler Language="C#" Class="a" %>

using System;
using System.Web;

public class a : IHttpHandler {
    
    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";
        System.Threading.Thread.Sleep(2000);
        context.Response.Write("Hello World");
    }
 
    public bool IsReusable {
        get {
            return false;
        }
    }

}