怎么会突然研究这个，是源于领导提出一个需求,先截几张图看下：

http://s6/mw690/001K7qSKzy6JP0vuy5D25&690

http://s6/mw690/001K7qSKzy6JP3Upakda5&690

页面最外层是个普通页面，左边为了保证在整个框架页上浮动，菜单是放在最外层的页面index.aspx上，里面嵌套一个iframe-default.aspx,才是真正的框架页，实现多个页签的切换是在中心框架页上动态加入iframe实现的

http://s10/mw690/001K7qSKzy6JP4TB5hL69&690
现提出要求，点击框架中心区域的页面内容时，自动隐藏左边菜单，而中心区域的页面时动态加载的，可能页面很复杂也会嵌套iframe，如何捕捉框架中心区域的点击事件，从而操作window.top的js的function来隐藏菜单，最初是考虑在最外层动态注册脚本到内层页面，增加document.onclick的事件绑定调用框架顶部的方法，但内层页面的不确定性，会嵌套iframe，很难达到预想的效果，转换思路如何能在整个iframe上捕捉click事件，脱离各页面自身的复杂度。iframe上本身是不存在click事件的，但是存在onfocus事件，并且通过document.activeElement获取焦点对象，从这一点展开思路：

var IframeOnClick = {
            resolution: 500,
            iframes: [],
            interval: null,
            Iframe: function() {
                this.element = arguments[0];
                this.cb = arguments[1];
                this.hasTracked = false;
            },
            track: function(element, cb) {
                this.iframes.push(new this.Iframe(element, cb));
                if (!this.interval) {
                    var _this = this;
                    this.interval = setInterval(function() { _this.checkClick(); }, this.resolution);
                }
            },
            destory: function(element) {
                for (var i in this.iframes) {
                    if (element == this.iframes[i].element) {
                        this.iframes.pop(this.iframes[i]);
                    }
                }
            },
            checkClick: function() {
                if (document.activeElement) {
                    var activeElement = document.activeElement;
                    for (var i in this.iframes) {
                        if (activeElement === this.iframes[i].element) { // user is in this Iframe
                            if (this.iframes[i].hasTracked == false) {
                                this.iframes[i].cb.apply(window, []);
                                this.iframes[i].hasTracked = true;
                            }
                        } else {
                            this.iframes[i].hasTracked = false;
                        }
                    }
                }
            }
        };
在中心框架页新增页签时，增加iframe时调用方法

IframeOnClick.track(document.getElementByIdx_x(id), function() { window.top.hideMenu('0'); });

删除页签时调用

IframeOnClick.destory(document.getElementByIdx_x(id));

最终实现效果，在点击框架中心区域页面内容时，自动隐藏左边菜单。