如何在div中添加多個iframe？

Question

首先，對不起我的英語，但我不是本地人，這是我的第一篇文章（是的，我是新來的成員）。

我有以下的HTML和jQuery代碼：

<div id="info" style="width: 100%; height:280px;"> 

if (sectores.getVisible()) { 
    if (url1) { 
    $('#info').html('<iframe width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" seamless src="' + url1 + '"></iframe>'); 
    } 
} 
if (despachos.getVisible()) { 
    if (url1) { 
    $('#info').html('<iframe width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" seamless src="' + url2 + '"></iframe>'); 
    } 
} 

結果： 它的工作原理，但只告訴我最後的 「IFRAME」。 我以爲我需要把「內部框架」放入一個堆棧或類似的東西......但我不確定。

所以，我想在信息'div'中顯示多個iframe。

問候！

Answer 1

推薦的方法是將append的iframe放入父級。通常情況下，這樣做的時候，你空父之前的任何附加操作：

var $info = $("#info"); 
$info.empty(); 

if (sectores.getVisible()) { 
    if (url1) { 
    $info.append('<iframe width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" seamless src="' + url1 + '"></iframe>'); 
    } 
} 

if (despachos.getVisible()) { 
    if (url1) { 
    $info.append('<iframe width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" seamless src="' + url2 + '"></iframe>'); 
    } 
} 

如果你想加入他們之前執行較少的DOM修改或者有一些特殊的情況下，你可以建立一個字符串的多個元素到DOM：

var $info = $("#info"); 
$info.empty(); 

var info_html = ""; 

if (sectores.getVisible()) { 
    if (url1) { 
    info_html += '<iframe width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" seamless src="' + url1 + '"></iframe>'; 
    } 
} 

if (despachos.getVisible()) { 
    if (url1) { 
    info_html += '<iframe width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" seamless src="' + url2 + '"></iframe>'; 
    } 
} 

$info.html(info_html); 

Answer 2

當您使用.html()時，您基本上會覆蓋一段代碼。

你應該做的卻是：

$('<iframe width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" seamless src="' + url1 + '"></iframe>').appendTo('#info'); 

Answer 3

你可以把第二iFrame成第二個「格」？
我會認爲你的第二個重寫第一個。

Answer 4

而不是.html()你應該使用其他.append()第二.html()會寫第一.html()

if (sectores.getVisible()) { 
    if (url1) { 
    $('#info').append('<iframe width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" seamless src="' + url1 + '"></iframe>'); 
    } 
} 
if (despachos.getVisible()) { 
    if (url1) { 
    $('#info').append('<iframe width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" seamless src="' + url2 + '"></iframe>'); 
    } 
}