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”。我认为我需要把“iframe”放在一个堆栈或类似的东西......但我不太确定。

所以，我想在info'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放到第二个“div”吗？我认为你的第二个会覆盖第一个。

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>');
  }
}

如何在div中添加多个iframe？

4 个答案: