记住Iframe页面刷新

时间:2015-11-10 14:42:38

标签: html iframe

我有一个使用Iframe设置的网页。我还在Iframe下方设置了4个按钮,这将导致它根据按下的按钮显示特定页面。

简单的东西。

我的问题是我需要每5分钟自动刷新一次页面。这会重置Iframe。是否有可能强制iframe保持原样,而页面的其余部分在其周围刷新?或者我可以让iframe记住'在哪里刷新?

HTML供参考 -

<iframe src="Kine-Yield-Data/KG4x10.htm" name="iframe_a" frameborder="0" width="100%" height="100"></iframe>
<br>

<a href="Kine-Yield-Data/KG4x10.htm" target="iframe_a" class="button">10</a>
&nbsp;
<a href="Kine-Yield-Data/KG4x25.htm" target="iframe_a" class="button">25</a>
&nbsp;
<a href="Kine-Yield-Data/KG4x30.htm" target="iframe_a" class="button">30</a>
&nbsp;
<a href="Kine-Yield-Data/KG4x50.htm" target="iframe_a" class="button">50</a>

我将链接设为按钮。

1 个答案:

答案 0 :(得分:2)

嗯,你可以用javascript做到这一点。

当您按住点击事件时,您可以保存框架路径并在“刷新”时将此值添加到您的网址,然后,您选择此值并再次设置在您的iframe上。我为此制作了一个脚本,看看:

var currentFramePath = '';
var iframe = '<iframe src="{src}" name="iframe_a" id="iframe_a "frameborder="0" width="100%" height="100"></iframe>';

            $(document).ready(function(){

                var urlFrame = getUrlParameter('currentFrame');

                if(urlFrame != null && urlFrame != ''){
                    $('#iframeContainer').html(iframe.replace('{src}', urlFrame));
                    currentFramePath = urlFrame;
                }

                $('.button').click(function(){
                    currentFramePath = $(this).attr('href');
                });

                setInterval(function(){
                    window.location = window.location.href.split('?')[0] + '?currentFrame=' + currentFramePath;
                }, 5000);

            });

            function getUrlParameter(sParam) {
                var sPageURL = decodeURIComponent(window.location.search.substring(1)),
                    sURLVariables = sPageURL.split('&'),
                    sParameterName,
                    i;

                for (i = 0; i < sURLVariables.length; i++) {
                    sParameterName = sURLVariables[i].split('=');

                    if (sParameterName[0] === sParam) {
                        return sParameterName[1] === undefined ? true : sParameterName[1];
                    }
                }
            };

HTML:

<div id='iframeContainer'>
        <iframe src="Kine-Yield-Data/KG4x10.htm" name="iframe_a" id="iframe_a "frameborder="0" width="100%" height="100"></iframe>
    </div>
<br>

<a href="Kine-Yield-Data/KG4x10.htm" target="iframe_a" class="button">10</a>
&nbsp;
<a href="Kine-Yield-Data/KG4x25.htm" target="iframe_a" class="button">25</a>
&nbsp;
<a href="Kine-Yield-Data/KG4x30.htm" target="iframe_a" class="button">30</a>
&nbsp;
<a href="Kine-Yield-Data/KG4x50.htm" target="iframe_a" class="button">50</a>

编辑:

Google Chrome不允许您更改iframe src属性,因此,我发现这样做的方法是使用新的SRC值重新创建元素。

我希望它可以帮到你。