Je pense que c’est une chose assez fondamentale, mais je n’arrive pas à trouver la solution. J’essaie d’incrémenter une valeur après le chargement d’un IFRAME.
le code ressemble à ceci:
var x=0; $(document).ready(function() { $('#iframe-2').load(function() { var x=x+1; }); $('#iframe-3').load(function() { var x=x+1; }); $('#iframe-4').load(function() { var x=x+1; }); $('#iframe-5').load(function() { var x=x+1; }); });
Ce que je veux faire, c’est donner un certain nombre d’iframes chargés qui sont mis à jour lorsqu’un iframe termine son chargement. Le code de sortie est comme ceci actuellement:
document.write(x + " Results");
merci beaucoup d’avance pour toute aide!
Tu devrais changer
var x=x+1;
à
x=x+1
Comme le mot clé var
crée une nouvelle variable à chaque fois dans votre load
, la variable globale x
n’est ni mise à jour ni incrémentée.
Vous déclarez une variable locale dans la fonction de rappel de chargement, de sorte qu’elle n’augmente pas le x
global, vous pouvez déclarer var x
intérieur de la fonction de rappel dom ready et l’utiliser dans la fonction de rappel de chargement.
$(document).ready(function() { var x = 0; $('#iframe-2').load(function() { x++; }); $('#iframe-3').load(function() { x++; }); $('#iframe-4').load(function() { x++; }); $('#iframe-5').load(function() { x++; }); });
Edit: après cela, document.write(x + " Results");
ne fonctionne toujours pas, car il s’exécute avant le chargement de l’iframe. Vous devez effectuer une vérification de manière asynchrone.
Voici la démo en direct .
$(document).ready(function() { var x = 0; $('iframe').load(function() { x++; }); var time_id = setInterval(function() { $('#count').text(x); if (x === $('iframe').length) { clearInterval(time_id); } }, 200); });
Le html:
Loaded iframe count: 0
J’ai finalement trouvé une solution très simple:
var x=0; $(document).ready(function() { $('#iframe-2').load(function() { $("#t2").css("display","inline"); x++; document.getElementById("tabs-1").innerHTML=x + " Results"; }); $('#iframe-3').load(function() { $("#t3").css("display","inline"); x++; document.getElementById("tabs-1").innerHTML=x + " Results"; }); $('#iframe-4').load(function() { $("#t4").css("display","inline"); x++; document.getElementById("tabs-1").innerHTML=x + " Results"; }); $('#iframe-5').load(function() { $("#t5").css("display","inline"); x++; document.getElementById("tabs-1").innerHTML=x + " Results"; }); });
Javascript a une “scope de fonction” – les variables n’existent que dans la fonction dans laquelle elles ont été créées. Il est donc possible d’avoir plusieurs variables différentes nommées x
, si et seulement si elles se trouvent dans des fonctions différentes (comme c’est le cas ici).
Les variables sont créées avec le mot-clé var
et accessibles sans mot-clé. Donc, var x = 10;
crée une variable nommée x
et x = 10;
modifie une variable existante nommée x
.
Dans votre code, chaque fonction appelle var x = 10;
. Puisque le x
précédemment défini a été défini dans une fonction externe, cette ligne est valide et a créé une nouvelle variable nommée x
, étendue à la fonction à laquelle elle est appelée. Si vous deviez omettre l’instruction var
, l’interpréteur examinera d’abord le l’espace de noms de la fonction actuelle et ne pas trouver x
. Ensuite, il passerait à la scope globale et trouverait le x
que vous avez déjà déclaré, et l’utiliserait.
En bref, omettez le mot var
dans chaque ligne sauf la ligne 1:
var x = 0; $(document).ready(function () { $('#iframe-2').load(function () { x = x + 1; }); $('#iframe-3').load(function () { x = x + 1; }); $('#iframe-4').load(function () { x = x + 1; }); $('#iframe-5').load(function () { x = x + 1; }); });
Une autre solution de remplacement pour la requête ci-dessus utilisant jQuery est ici …
HTML:
JQuery:
var x = 0; $(function() { $('iframe:eq(0)').load(function() { x = x + 1; result(x); }); $('iframe:eq(1)').load(function() { x = x + 1; result(x); }); $('iframe:eq(2)').load(function() { x = x + 1; result(x); }); $('iframe:eq(3)').load(function() { x = x + 1; result(x); }); }); function result(x) { if (x == null || typeof(x) == "undefined") x = 0; $("#top").html("Loaded iframe count: " + x + "
"); $("#bottom").html("
Loaded iframe count: " + x + ""); }
Essayez aussi codebins http://codebins.com/codes/home/4ldqpbk