更改 iframe src 会重定向到主页

Question

首先这是代码

<div id="channelmiddle" class="middle-content alignleft">
    <script type="text/javascript">
    function changechannel(ch)
    {
        var url = "ch"+ch+".html";
        document.getElementById("channelchange").src = "ch"+ch+".html";
    }
    </script>
    <center>
    <button class="button_static" onclick="changechannel(1)">Channel 1</button>
    <button class="button_static" onclick="changechannel(2)">Channel 2</button>
    <button class="button_static" onclick="changechannel(3)">Channel 3</button>
    <button class="button_static" onclick="changechannel(4)">Channel 4</button>
    <button class="button_static" onclick="changechannel(5)">Channel 5</button>
    </center>
    <iframe id="channelchange" src="ch1.html" onLoad="alert('123')" width="500" height="400" scrolling="no"></iframe>
</div>

在此页面上，每当我单击按钮时，它都会重定向到主页。我不知道为什么。有人可以帮助我吗？您是否需要有关代码的更多信息？

Answer 1

现代浏览器内置了安全检查，以防止 iframe 在更改 src 属性时显示 Web 内容。Chrome 有一个功能绕过了使用 &output=embed 的功能。请参阅此文章。从我的测试中，您可以更改 src 属性，但内容不会更改。您可以做的最好的事情是在初始页面加载时加载 iframe，而不是更改 src 属性。有几种解决方案。

1. 进行重新设计。在 iframe 中加载需要显示的内容，而无需使用按钮单击。

2. 将用户发送到另一个页面。使用与初始页面加载上的按钮对应的 url 设置 iframe 的 src。

3. 如果绝对必须这样做，请尝试使每个 url 的 iframe 根据按钮单击隐藏 iframe。这不是一个理想的解决方案，但它可以实现您的目标。