zoukankan      html  css  js  c++  java
  • auto refresh iframe

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
    
        <script></script>
        <style>
            .gray {color:#ccc !important; background-color:#eee !important; border-color:#eee  !important;  }
            .black { color:black !important;  }
            #autoRefresh_label { cursor:pointer; }
        </style>
    </head>
    <body>
        <div id="autoRefresh_div"   style="-moz-user-select:none;" onselectstart="javascript:return false;">
            <input type="checkbox" checked="checked" id="autoRefresh_checkbox" />
            <label for="autoRefresh_checkbox" id="autoRefresh_label"><select id="autoRefresh_select">
                            <option value="1">1分钟</option>
                            <option value="3" selected="selected">3分钟</option>
                            <option value="10">10分钟</option>
                            <option value="30">30分钟</option>
                        </select>
                自动更新</label>
        </div>
    
        <script>
          
            window.$$ = function (e) {
                if (document.getElementById(e)) { return document.getElementById(e); }
            }
    
    
            //父子同域才可以使用
            //document.domain = '';如果父子同域后缀,则可以通过设置该属性而实现跨域访问
    
            window.autoRefresh = function () {
                this.getCurrentIframe = function () {
                    if (!parent || parent.document.getElementsByTagName('iframe').length === 0) {
                        return undefined;
                    }
                    var iframes = parent.document.getElementsByTagName('iframe');
                    for (var i = 0; i < iframes.length; i++) {
                        if (iframes[i].src === document.location.href) {
                            return iframes[i];
                        }
                    }
    
                }
    
                var that = this;
    
                this.init = function () {
    
    
                    if (!parent['autoRefresh_checkbox_checked']) {
                        parent['autoRefresh_checkbox_checked'] = $$('autoRefresh_checkbox').checked;
                    }
                    else {
                        $$('autoRefresh_checkbox').checked = parent['autoRefresh_checkbox_checked'];
                    }
    
                    $$('autoRefresh_checkbox').onchange = function () {
                        parent['autoRefresh_checkbox_checked'] = $$('autoRefresh_checkbox').checked;
    
    
                    };
                    $$('autoRefresh_checkbox').onclick = function () {
    
                        $$('autoRefresh_checkbox').checked === false
                                           ? $$('autoRefresh_select').className = $$('autoRefresh_label').className = 'gray'
                                           : $$('autoRefresh_select').className = $$('autoRefresh_label').className = 'black';
                    }
    
                    if (!parent['autoRefresh_select_selected']) {
                        parent['autoRefresh_select_selected'] = $$('autoRefresh_select').value;
                    }
                    else {
                        $$('autoRefresh_select').value = parent['autoRefresh_select_selected'];
                    }
                    $$('autoRefresh_select').onchange = function () {
                        parent['autoRefresh_select_selected'] = $$('autoRefresh_select').value;
                        this.start();
                    };
    
    
                }
    
                this.start = function () {
                    var time = parseInt($$('autoRefresh_select').value) * 1000 * 60;
                    setInterval(function () {
                        if ($$('autoRefresh_checkbox').checked) {
                            that.getCurrentIframe().src = document.location.href;
                        }
                    }, time);
                }
    
                this.init();
            }
    
    
    
            new autoRefresh().start();
    
        </script>
    </body>
    
    </html>


    if you put these codes in the iframe,then iframe can refresh auto.

  • 相关阅读:
    [转]C#进阶系列——WebApi 接口参数不再困惑:传参详解
    Netty中的三种Reactor(反应堆)
    I/O模型之三:两种高性能 I/O 设计模式 Reactor 和 Proactor
    【转】第8章 前摄器(Proactor):用于为异步事件多路分离和分派处理器的对象行为模式
    mysql 数据库 自动截取数据的问题---mysql的sql_model的四种模式:宽松模式、严格模式
    spring-session之四:Spring Session下的Redis存储结构
    Mysql auto_increment总结
    mysql实战优化之一:sql优化
    mysql字符集和校对规则(Mysql校对集)
    Oracle B-tree、位图、全文索引三大索引性能比较及优缺点汇总
  • 原文地址:https://www.cnblogs.com/langu/p/3951275.html
Copyright © 2011-2022 走看看