Question

首先，我为每个网址创建一个iframe：

$url = array();
$url[] = 'example1.com';
$url[] = 'example2.com';

foreach($url as $u){
   echo '<div class="frame_container">
         <iframe  "width="200" height="200" id="myiframe" src="http://www.'.$u.'">  </iframe>
         <div class="loadingtime"></div>
         </div>';
}

然后我有这个javascript应该计算每帧开始加载之前的时间，以及加载后的时间：

$(document).ready(function () {
load_time(); 
});
function load_time(){
var beforeLoad = (new Date()).getTime();
$('.frame_container iframe').on('load', function() {
    var afterLoad = (new Date()).getTime();
    var result = (afterLoad - beforeLoad) / 1000;
    // beforeLoad = afterLoad;
    $(this).parent().find('div.loadingtime').html(result);
});
}

我的问题 - 所有iframe的beforeLoad值都相同。每个帧的值应该不同，因为所有的fames都不会在同一时间开始加载。有什么建议吗？

Answer 1

使用php编写第一个div然后使用你的javascript代码

var curFrame = 1;
var totalIFrame = 2;
var url = new Array('http://www.abc.com','http://www.xyz.com');

var beforeLoad = (new Date()).getTime();
var result = 0;

function addTime() {
    var afterLoad = (new Date()).getTime();
    result += ((afterLoad - beforeLoad) / 1000);

    if(totalIFrame==curFrame){// number of iframe you will be loading
        $(this).parent().find('div.loadingtime').html(result);
    } else {
        $('.frame_container').append('<iframe  "width="200" height="200" id="myiframe" src="'+url[curFrame]+'" onload="addTime()">  </iframe>');
    }

    curFrame++;
}

使用javascript计算多个iframe的加载时间

1 个答案: