iframe重新加载按钮

时间:2012-07-02 01:49:35

标签: javascript html css button iframe

我查看了许多网站,但似乎没有一个正常工作或者我不理解它们。我想要一个刷新某个iframe的简单按钮。该按钮位于父页面上,iframe名称为“正确”。

2 个答案:

答案 0 :(得分:17)

有很多方法可以做到这一点。假设这个iframe标记:

<iframe name="Right" src="http://www.example.com"></iframe>

我们可以使用function call

来完成

<强> HTML

<button onclick="refreshIframe();">Refresh Iframe</button>

<强> JS

function refreshIframe() {
    var ifr = document.getElementsByName('Right')[0];
    ifr.src = ifr.src;
}

inline JS

<button onclick="var ifr=document.getElementsByName('Right')[0]; ifr.src=ifr.src;">Refresh Iframe</button>

或使用event listener

<强> HTML

<button id="iframeRefresher">Refresh Iframe</button>

<强> JS

window.onload = function() {
    document.getElementById('iframeRefresher').addEventListener('click', function() {
        var ifr = document.getElementsByName('Right')[0];
        ifr.src = ifr.src;
    });
}

与上面相同,现在是with support for IE <= 8 and using a function in the global scope as handler而不是匿名的:

<强> HTML

<button id="iframeRefresher">Refresh Iframe</button>

<强> JS

window.onload = function() {
    var refresherButton = document.getElementById('iframeRefresher');
    if (refresherButton.addEventListener)
        refresherButton.addEventListener('click', refreshIframe, false);
    else
        refresherButton.attachEvent('click', refreshIframe);
}

function refreshIframe() {
    var ifr = document.getElementsByName('Right')[0];
    ifr.src = ifr.src;
}

所有这一切都没有触及jQuery或任何其他库。

您应该使用以下哪些?无论您认为哪个更易于维护和可读。尽可能避免全局变量。我个人避免使用标记的内联JS,并且听众似乎没必要,但那只是我。选择最适合你的人。

答案 1 :(得分:-3)

在iframe中添加新的id,然后尝试以下代码。

var iframe = document.getElementById('FrameId');
$("button").click(function() {
    iframe.src = iframe.src;
}):