Question

我使用了iframe，如下所示：

<iframe style='width: 330px; height: 278px' scrolling='no' name="iframeId" class="advPlayer" id="iframeId" frameborder="0" src='../../player/iabpreview.php?adid=<?php echo $selectedAdIdx ?>&amp;autoPlay=true'></iframe>

每当我点击<div>时，我都必须更改iframe的来源。我使用以下代码：

if ($j.browser.msie) {            
  frames['iframeId'].window.location="../player/iabpreview.php?adid="+adId+"&autoPlay=true";
}else {
  $j(".advPlayer").eq(0).attr("src", "../player/iabpreview.php?adid="+adId+"&autoPlay=true");    
}

这适用于Firefox，但不适用于Internet Explorer。

哪些代码也适用于Internet Explorer？

Answer 1

您绝不应该使用“浏览器检测”，而是检测功能。 imho最安全的方式就是：

function SetIFrameSource(cid, url){
  var myframe = document.getElementById(cid);
  if(myframe !== null){
    if(myframe.src){
      myframe.src = url; }
    else if(myframe.contentWindow !== null && myframe.contentWindow.location !== null){
      myframe.contentWindow.location = url; }
    else{ 
      myframe.setAttribute('src', url); 
    }
  }
}

只测试src属性是否可用。如果没有，请在内容窗口上进行测试，最后一次尝试是setAttribute。

Answer 2

document.getElementById("iframeId").src = "Your URL here."

Answer 3

我尝试了getElementById和其他很多变体。在IE，FF，Opera或Chrome上没有相同的功能。

这个效果很好：parent.frames.IFRAME_ID.location.href = '/';

Answer 4

帧集合返回窗口对象（或等价物）。您想要定位文档对象;尝试做：

window.frames ['iframeId']。document.location.href = ....

这适用于IE，FF，Safari等，所以也不需要凌乱的浏览器检测。

NB。 IIRC框架集合在IE浏览器中引用名称，在其他浏览器中引用 id ，因此您需要名称和ID属性 - 但是您已经拥有它，所以不用担心！< / p>

Answer 5

document.getElementById('MsgBoxWindow').getAttribute('src')适用于Internet Explorer，Firefox，Safari，以获取源网址。

document.getElementById('MsgBoxWindow').setAttribute('src', urlwithinthedomain)适用于相同的浏览器以设置源网址。

但是，必须在调用之前加载iframe。调用JavaScript代码时，请勿将其放在iframe之前。如果您在页面加载后立即调用iframe，则可以将它们放在iframe之后，并且它将按预期工作。

Answer 6

由于您已经使用了jquery标记，因此这可能很方便。

function resizeIframe(height) {
    height = parseInt(height);
    height += 100;
    $('iframe#youriframeID').attr('height', height);   
}

如果您正在进行跨浏览器调整大小，请查看此帖子，其中介绍了如何根据iframe内容自动调整高度。您需要访问iframed网站的html。 Resizing an iframe based on content

Answer 7

您可以使用以下两种方法更改iframe的src：

更改href。
更改src。

两种方法都要求在尝试修改之前完全加载iFrame。

更改href适用于所有浏览器，包括IE5。您可以解决框架

通过引用元素的contentwindow：

var myFrame = document.getElementById（'myFrame'）; myFrames.contentWindow.location ='http://example.com';
通过引用元素的名称：

var myFrame = window.frames.myFrame; //其中myFrame是元素的名称 myFrame.location ='http://example.com';

更改src如上所述，通过选择元素并更改src - 但它必须是子元素，而不是子元素。

var myFrame = document.getElementById('myFrame');
myFrame.src = 'http://example.com'

Answer 8

我从其他地方得到这个：

function getElementById(strId) {
  var element;

  if (document.getElementById) {
    element = document.getElementById(strId);
  }
  else if (document.all) {
    element = document.all[strId];
  } else if (document.layers) {
    element = document.layers[strId];
  } else {
    element = eval("document." + strId);
  }

  return element;
}

Answer 9

var myFrame = document.getElementById('myFrame'); 
myFrame.src = 'http://example.com';

内存泄漏。 iframe src多次更改后，浏览器会慢慢爬行。

Answer 10

window.frames['iframeId'].document.location.href =...

也有内存泄漏。在IE浏览器中，效果更加放弃。

Answer 11

<script type="text/javascript">
  function changesrc(iframid, pagesrc)
  {
    document.getElementById(iframid).src = pagesrc; 
  }
</script>

<table style="width: 100%">
<tr>
  <td>
    <a href="#" onclick="changesrc('iframe1','page1.php')">Page1</a> <br/>
    <a href="#" onclick="changesrc('iframe1','page2.php')">Page2</a> <br/>
    <a href="#" onclick="changesrc('iframe1','page3.php')">Page3</a>
  </td>
  <td>   
    <iframe id="iframe1" src="page1.php" scrolling="no" 
            height="100%" width="100%" style="border:0px;"></iframe>
  </td>
</tr>
</table>

Answer 12

只需使用以下代码。

var iframe = document.getElementById('IFRAME ID'); // just for clarity
iframe .src = 'URL here';

它应该适用于每个浏览器。

Answer 13

请注意，如果您只是更改URL的#anchor（即从page.php #this更改为page.php＃），那么IE将不会刷新页面，但Chrome和Firefox会刷新。如果这是你的问题，那么你可能想要在查询字符串中随机添加一些内容，以使IE认为它是一个全新的页面并强制重新加载。

例如（使用jQuery）：

var hash = 'yourHash';
var rand = 1 + Math.floor(Math.random() * 9999);
var helpUrl = 'page.php?rand=' + rand + '#' + hash;
$('#iframe').attr('src', helpUrl);

改变iframe源即使用javascript

13 个答案: