iframe 双击事件

上次接到一个摄像头双击放大的功能

这个摄像头页面是iframe双击就要点iframe..

但是iframe又没有事件响应

最后只好用document.activeElement (选中element) 来实现一个伪双击iframe事件

 

  

        var IframeOnClick = {  
            resolution: 200,  
            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);  
                }  
            },  
            checkClick: function() {  
                if (document.activeElement) {
                    var activeElement = document.activeElement;
                    for (var i in this.iframes) {  
                        if (activeElement === this.iframes[i].element) { 
                            document.activeElement.blur();
                            // 如果点击的是这个iframe 这个iframe处于未被点击的状态
                            if (this.iframes[i].hasTracked == false) {   
                                // 标记为被点击并等待下一次点击
                                this.iframes[i].hasTracked = true;  
                                // 如果200毫秒内没有被在此点击重置次状态
                                this.iframes[i].setTimeout = setTimeout(function(iframe) {
                                    iframe.hasTracked = false;
                                }, 500, this.iframes[i] );
                            } else {
                                // 如果判断这个已经是被点击的状态了
                                // 清除掉等待事件
                                clearTimeout(this.iframes[i].setTimeout);
                                // 修改为未选择状态
                                this.iframes[i].hasTracked = false;
                                // 触发事件
                                this.iframes[i].cb.apply(window, []);   
                            }
                        } else {  
                            this.iframes[i].hasTracked = false;  
                        }  
                    }  
                }
            }
        };  
        
        IframeOnClick.track(document.getElementById("iFrame"), function() { alert('123') });

 

posted @ 2020-08-19 16:41  blurs  阅读(774)  评论(0编辑  收藏  举报