Question

我的页面上有iframe加载。 iframe的内容仅在页面上加载了其余内容后加载。是否可以在主页上的其他内容之前加载iframe中的内容？

由于

Answer 1

    <iframe id="miiframe" src="http://www.apple.com"></iframe>
    <!-- example -->
    <div id="loading" style="position:fixed;background:red;width:100%;height:100%;top:0;left:0;z-index:2;"></div>
    <img id="background" style="position:absolute;width:100%;height:100%;top:0;left:0;z-index:-1;"/>

<script>
var loaded = false;
console.log(loaded);
function preloader(){
            document.getElementById("loading").style.display = "none";
            document.getElementById("miiframe").style.display = "block";
    loaded = true;
            console.log(loaded);
}//preloader
var loadiframe = document.getElementById('miiframe');
loadiframe.onload = preloader;

if(!loaded){
    window.onload = function(){
        background = document.getElementById("background");
        background.src ="http://www.hdwallpapers.in/walls/cute_baby_in_autumn-wide.jpg";
    };
}
</script>

see JSFIDDLE

Answer 2

尝试

// hold `ready` event
$.holdReady(true);

var frame = $("<iframe>");

$(frame).load(function(e) {
    // release `ready` event
    $.holdReady(false)
});

// append `frame` to document
$("body").append(frame);

$(document).ready(function() {
  // do stuff 
  // after `frame` loaded
  $("body").append("done")
});

jsfiddle http://jsfiddle.net/guest271314/x7ptnbjy/

请参阅jQuery.holdReady()

在其他内容之前加载iframe

2 个答案: