码迷,mamicode.com
首页 > 其他好文 > 详细

auto refresh iframe

时间:2014-09-02 14:04:54      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:des   style   blog   http   color   io   使用   java   ar   

<!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.

auto refresh iframe

标签:des   style   blog   http   color   io   使用   java   ar   

原文地址:http://www.cnblogs.com/langu/p/3951275.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!