逐个创建多个Iframe

时间:2017-03-11 14:46:32

标签: javascript iframe

我如何逐个加载多个iframe?

DadosDashboard是一个json:Posicao = number; objeto = URL / SRC;

$(this.DadosDashboard).each(function(index, el) {

        if (document.getElementById("ContainerGraficosAdd" + el.Posicao) != null) {
            document.getElementById("ContainerGraficosAdd" + el.Posicao).innerHTML = '<iframe width="100%" height="100%" id="iframe' + el.Posicao + '" class="iframe" scrolling="no" src="el.Objeto.toLowerCase()" frameborder="0" ></iframe>';
        }
    });

这样一直加载。

2 个答案:

答案 0 :(得分:1)

您可以使用setTimeout并在每次.each次迭代时增加时间延迟(index * 500会将每个iframe的创建时间间隔500毫秒)。

$(this.DadosDashboard).each(function(index, el) {
    if (document.getElementById("ContainerGraficosAdd" + el.Posicao) != null) {
      setTimeout(function() {
        document.getElementById("ContainerGraficosAdd" + el.Posicao).innerHTML = '<iframe width="100%" height="100%" id="iframe' + el.Posicao + '" class="iframe" scrolling="no" src="el.Objeto.toLowerCase()" frameborder="0" ></iframe>';
      }, index * 500)
    }
});

答案 1 :(得分:0)

我做的不同,我在每个iframe上创建“iframe.addEventListener('load',function(){}”,这个调用完成加载,所以我调用/创建这里面的下一个iframe ...这可以是对任何需要逐个调用多个iframe的人都有用...

  this.renderComponents = function(srcativo, posicao, index){

  if (document.getElementById("ContainerGraficosAdd" + posicao) == null) {
    return;
  }
   document.getElementById("ContainerGraficosAdd"+posicao).innerHTML = '<iframe onload="' + _mthis.me() + '.setIframeHeight(iframe' + posicao + ')" width="100%" height="100%" id="iframe' + posicao + '" class="iframe" scrolling="no" src="' + srcativo.toLowerCase() + '" frameborder="0" ></iframe>';
var iframe = document.getElementById("iframe"+posicao);

    iframe.addEventListener('load', function(){
    index = index+1;
  typeof(some_variable) !== "undefined" && some_variable !== null
    if(_mthis.DadosDashboard[index]  === undefined || _mthis.DadosDashboard[index]==null){
   return;
  }
  srcativo = _mthis.DadosDashboard[index].Objeto;
  posicao = _mthis.DadosDashboard[index].Posicao;
  _mthis.renderComponents(srcativo,posicao,index);});}