Question

所以直接问题，我正在编写一个js，如果屏幕分辨率发生变化，应该更改 iframe 的 src

<script language="javascript">
function newframe()
{
    var w = screen.width;
    var srchframe = document.getElementById("proj");
    var targetURL1 = "http://wms.indianpropertynetwork.com/exchange/frames/clients.featured_projects.asp?cnt=5&wd=880&prj=1";   
    var targetURL2 = "http://lpm.indianpropertynetwork.com/exchange/frames/clients.featured_projects.asp?cnt=4&wd=668&prj=1";   

    if (srchframe.src != targetURL1 && w > 1300  )
    {srchframe.src = targetURL1 }

    else 
    { srchframe.src = targetURL2 }  
}   
</script>

并在以下iframe中调用此函数

<iframe id="proj" onload="newframe();" marginwidth="0" marginheight="0" width="100%" height="200px" frameborder="0" scrolling="No" ></iframe>

脚本的问题是它继续按交替顺序加载网址并且不会停止加载。

Answer 1

您正在使用onload处理程序来启动另一个加载周期，因此不断重新加载是您的代码似乎要执行的操作。

您的代码：

如何处理iframe中的网页加载？调用newFrame（）。这是您的代码阅读onload="newframe();"
newFrame（）正在设置框架src，导致它加载另一个页面。在if的任何调用中，您src正在为srchframe的{{1}}分配新网址。并且如果当前不是URL 1而是URL 2，则加载URL 1，否则它实际上导致交换两个URL。
由于在2中切换了页面，将触发另一个onload事件。

基本问题是：通过将URL分配给newframe()，该框架的页面被替换为加载另一个页面。所以不要调整iframe的src属性，除非它实际上是以这种方式加载另一个页面。

基本上你应该尝试不同的方法。按照最初的描述：

如果屏幕分辨率发生变化，
应该更改 iframe 的 src

所以你不应该绑定到iframe的onload事件，而是绑定到外部窗口的onresize事件。即使这不是改变屏幕分辨率，它也比你的方法更好。最后尝试在我对这篇文章的回答中提出的媒体查询：https://stackoverflow.com/questions/23198520/website-adapting-to-different-monitor-sizes/23198630#23198630

Answer 2

只执行一次函数，因为每次更改src时都会调用onLoad，为此您可以在bool的帮助下执行，下面是您可以使用的代码：

<强> HTML：

<script language="javascript">
var newFrameCalled = false;
function newframe()
{
    if(newFrameCalled)
        return;
    var w = screen.width;
    var srchframe = document.getElementById("proj");
    var targetURL1 = "http://wms.indianpropertynetwork.com/exchange/frames/clients.featured_projects.asp?cnt=5&wd=880&prj=1";   
    var targetURL2 = "http://lpm.indianpropertynetwork.com/exchange/frames/clients.featured_projects.asp?cnt=4&wd=668&prj=1";   

    if (srchframe.src != targetURL1 && w > 1300  )
    {srchframe.src = targetURL1 }

    else 
    { srchframe.src = targetURL2 }
    newFrameCalled = true;  
}   
</script>

希望这有帮助。

通过js更改iframe src

2 个答案: