C'était le problème exact que j'ai rencontré avec notre client. J'ai créé un petit plugin jquery qui semble fonctionner pour la préparation iframe. Il utilise l'interrogation pour vérifier le document iframe readyState combiné avec l'url du document interne combiné avec la source iframe pour s'assurer que l'iframe est en fait «prêt».
Le problème avec "onload" est que vous avez besoin d'accéder à l'iframe réel ajouté au DOM, si ce n'est pas le cas, vous devez essayer d'attraper le chargement de l'iframe qui, s'il est mis en cache, vous ne le pourrez peut-être pas. Ce dont j'avais besoin était un script qui pouvait être appelé à tout moment et déterminer si l'iframe était "prêt" ou non.
Voici la question:
Saint Graal pour déterminer si l'iframe locale a été chargée ou non
et voici le jsfiddle que j'ai finalement trouvé.
https://jsfiddle.net/q0smjkh5/10/
Dans le jsfiddle ci-dessus, j'attends que onload ajoute une iframe au dom, puis je vérifie l'état prêt du document interne de l'iframe - qui devrait être interdomaine car il pointe vers wikipedia - mais Chrome semble signaler "terminé". La méthode iready du plug-in est alors appelée lorsque l'iframe est en fait prête. Le rappel essaie de vérifier à nouveau l'état prêt du document interne - cette fois en signalant une requête interdomaine (ce qui est correct) - de toute façon, il semble fonctionner pour ce dont j'ai besoin et j'espère que cela aidera les autres.
<script>
(function($, document, undefined) {
$.fn["iready"] = function(callback) {
var ifr = this.filter("iframe"),
arg = arguments,
src = this,
clc = null, // collection
lng = 50, // length of time to wait between intervals
ivl = -1, // interval id
chk = function(ifr) {
try {
var cnt = ifr.contents(),
doc = cnt[0],
src = ifr.attr("src"),
url = doc.URL;
switch (doc.readyState) {
case "complete":
if (!src || src === "about:blank") {
// we don't care about empty iframes
ifr.data("ready", "true");
} else if (!url || url === "about:blank") {
// empty document still needs loaded
ifr.data("ready", undefined);
} else {
// not an empty iframe and not an empty src
// should be loaded
ifr.data("ready", true);
}
break;
case "interactive":
ifr.data("ready", "true");
break;
case "loading":
default:
// still loading
break;
}
} catch (ignore) {
// as far as we're concerned the iframe is ready
// since we won't be able to access it cross domain
ifr.data("ready", "true");
}
return ifr.data("ready") === "true";
};
if (ifr.length) {
ifr.each(function() {
if (!$(this).data("ready")) {
// add to collection
clc = (clc) ? clc.add($(this)) : $(this);
}
});
if (clc) {
ivl = setInterval(function() {
var rd = true;
clc.each(function() {
if (!$(this).data("ready")) {
if (!chk($(this))) {
rd = false;
}
}
});
if (rd) {
clearInterval(ivl);
clc = null;
callback.apply(src, arg);
}
}, lng);
} else {
clc = null;
callback.apply(src, arg);
}
} else {
clc = null;
callback.apply(this, arguments);
}
return this;
};
}(jQuery, document));
</script>