JavaScript是不調整的iframe

我似乎無法得到這個iframe來調整JavaScript是不調整的iframe

<body> 
    <script type="text/javascript"> 
     function setIframe(src, iwidth, iheight) { 
      var cFrame = document.getElementById('contentFrame'); 
      cFrame.src = src; 
      cFrame.width = iwidth; 
      cFrame.height = iheight; 
     } 
    </script> 
    <div>Getting Started 
     <div onclick="setIframe('login.aspx','800px','1000px');">Set Up</div> 
    </div> 
    <div id="content" style="background-color:#CCC"><iframe src="support.htm" id="contentFrame" style="width:400px;height:500px"></iframe> 
    </div>

爲了簡單起見，我沒有包括一些包裝的div，因爲它們只用於風格。然而，上面的兩個外部div是一個flexbox的div，所以它們被水平顯示，而不是每個佔據整個水平空間。我將content div設置爲100％的寬度，並將第一個div設置爲固定寬度。正如您所看到的，iframe也以內嵌硬編碼的固定寬度/高度開始。另請注意，爲iframe工作的src在js函數中工作，只是不是寬度和高度。

Thx

來源

2016-04-05 user192632

這就是我相信我的情況。我給第二個div上色，這樣我可以看到它有多少空間，並且有足夠的空間接受irame的新大小，但它不會調整大小。 – user192632

應更改的iframe，而不是（CSS）的樣式：

<script type="text/javascript"> 
 
     function setIframe(src, iwidth, iheight) { 
 
      var cFrame = document.getElementById('contentFrame'); 
 
      cFrame.src = src; 
 
      cFrame.style.width = iwidth + 'px'; 
 
      cFrame.style.height = iheight + 'px'; 
 
     } 
 
    </script> 
 
    <div>Getting Started 
 
     <div onclick="setIframe('login.aspx','800px','1000px');">Set Up</div> 
 
    </div> 
 
    <div id="content" style="background-color:#CCC"><iframe src="support.htm" id="contentFrame" style="width:400px;height:500px"></iframe> 
 
    </div>

來源

2016-04-05 13:25:25

哎呀，當然是這個問題。讓我試試看，但我相信它會起作用。 – user192632

我寫了很多jQuery，但在js中這樣做很簡單，但忘記了dom對象的樣式部分。謝謝。我會將此標記爲已接受，並將其他標記爲有幫助 – user192632

您有內聯樣式覆蓋了寬度和高度屬性。

如果刪除內嵌樣式，它應該工作

<script type="text/javascript"> 
 
    function setIframe(src, iwidth, iheight) { 
 
    var cFrame = document.getElementById('contentFrame'); 
 
    cFrame.src = src; 
 
    cFrame.width = iwidth; 
 
    cFrame.height = iheight; 
 
    } 
 
</script> 
 
<div>Getting Started 
 
    <div onclick="setIframe('login.aspx','800px','1000px');">Set Up</div> 
 
</div> 
 
<div id="content" style="background-color:#CCC"> 
 
    <iframe src="support.htm" id="contentFrame" width="400" height="500"></iframe> 
 
</div>

或者，你可以設置cFrame.style.width/height

來源

2016-04-05 13:18:00

既然您已經在您的代碼中使用了jQuery，那麼我會假設您已經開放了它來執行jQuery方法。

$('#myframe').width('900'); 
$('#myframe').height('800');

如果您不想使用jQuery，@ Dr.Flink的答案是要走的路。

來源

2016-04-05 13:27:02

您的回答完全正確且有幫助，只是認爲另一個回答是用我的話來說就是我決定如何做到這一點。你是對的，我通常使用jQuery。可能下次會。 – user192632

JavaScript是不調整的iframe

回答

相關問題