Question

我想知道我的iteration何时从我的网页外部完成，我的迭代发生在frame's孩子内iframe

这里是我的例子：Live URL点击第一个按钮，第二个按钮等待3秒。

$(function(){

  var total = 1000; 
  var i = 0;

  var iterate = function(){

    setTimeout(function(){

      var place = $('#iFrame1').contents().find('#iFrame2').contents().find('body');
      place.append('<ul class="list"></ul>');

      for(i=0; i < total; i++) {
        place.find('.list').append('<li>'+i+'</li>');
      }

    }, 3000);
    //how to find all this done from outside of this function?
  }

  var iFrame1 = $('<iframe />', {id:'iFrame1'});

  var iFrame2 = $('<iframe />', {id:'iFrame2'});

  var button2 = $('<button />', {text:'Child Button', click:iterate});

  var button = $('<button />',
    {
      text:'Click Me',
      click:function(){

        $(this).parents('body').append(iFrame2);

        $('#iFrame1').contents().find('#iFrame2').contents().find('body').append( button2 );

      }

    }
  );


  setTimeout(function(){
    $('.container').append( iFrame1 );
    $('#iFrame1').contents().find('body').append(button);

  },1000);

});

place完全li之后如何从文档外部了解。{p>我正在从 Chrome浏览器控制台运行我的代码。

Answer 1

我已创建this fiddle以尝试回答此问题。这就是我所做的：

添加此处理程序以在迭代完成时运行：

var onIterationDone = function() { console.log("Iteration Done"); alert("Done!"); };
将此处理程序连接到iterationDone上的自定义事件button2后立即添加：

var button = $('<button />', { text: 'Click Me', click: function() { $(this).parents('body').append(iFrame2); $('#iFrame1').contents().find('#iFrame2').contents().find('body').append(button2); button2.on('iterationDone', onIterationDone); } });

迭代完成后立即触发自定义事件：

setTimeout(function() { var place = $('#iFrame1').contents().find('#iFrame2').contents().find('body'); place.append('<ul class="list"></ul>'); for (i = 0; i < total; i++) { place.find('.list').append('<li>' + i + '</li>'); } // Trigger the custom event. button2.trigger('iterationDone'); }, 1000);

这是你想要达到的目标吗？

如何找到循环迭代 - 从具有Iframes页面的网页外部？

1 个答案: