在iframe完成加载后再加载iframe

时间:2016-01-05 10:15:09

标签: javascript jquery jsp iframe iframe-app

我在网页中有多个iframe标记,但我希望它们不会一次加载所有标记。这意味着,我希望iframe1在页面打开后开始加载,然后当它完全加载完毕后,我希望iframe2开始加载,然后完全加载,然后 iframe3开始加载等等。

我对JSP完全陌生,对JavaScript不是很专业。

<iframe id="iframe1" src="..."></iframe>
<iframe id="iframe2" src="..."></iframe>
<iframe id="iframe3" src="..."></iframe>
.
.
.

1 个答案:

答案 0 :(得分:0)

使用这样的html:

<iframe id="iframe1" data-src="..."></iframe>
<iframe id="iframe2" data-src="..."></iframe>
<iframe id="iframe3" data-src="..."></iframe>

和js:

$(function() {
  var iframes = $('iframe');
  var i = 0;
  (function next() {
      var iframe = iframes.eq(i++);
      if (iframe.length) {
          iframe.attr('src', iframe.data('src')).load(next);
      }
  })();
});