276 votes

Quelle est la meilleure façon de recharger / rafraîchir un iframe ?

Je voudrais recharger un <iframe> en utilisant JavaScript. Le meilleur moyen que j'ai trouvé jusqu'à présent était de définir le paramètre de l'iframe src à lui-même, mais ce n'est pas très propre. Avez-vous des idées ?

4 votes

Y a-t-il une raison pour laquelle le fait de définir le src à lui-même n'est pas propre ? Il semble que ce soit la seule solution qui fonctionne dans tous les navigateurs et dans tous les domaines.

0 votes

Fixer le src à lui-même pose des problèmes si vous avez un lien ailleurs qui cible l'attribut <iframe> . Le cadre affichera alors la page initiale telle qu'elle a été conçue à l'origine.

256voto

Ed. Points 1089
document.getElementById('some_frame_id').contentWindow.location.reload();

Faites attention, dans Firefox, window.frames[] ne peut pas être indexé par id, mais par nom ou par indice

32 votes

En fait, cette approche n'a pas fonctionné pour moi dans Chrome. Il n'y avait pas de propriété 'contentWindow'. Il était toutefois possible d'utiliser document.getElementById('some_frame_id').location.reload() ; La méthode qui a fonctionné à la fois pour FF et Chrome était document.getElementById('iframeid').src = document.getElementById('iframeid').src

1 votes

@MikeBevz peut location.reload est également accessible en utilisant le sélecteur Jquery ?

2 votes

Absolument, ça marche, mais je suis coincé avec la politique d'origine du même domaine ==a

209voto

evko Points 601
document.getElementById('iframeid').src = document.getElementById('iframeid').src

Il rechargera le iframe même à travers les domaines ! Testé avec IE7/8, Firefox et Chrome.

78 votes

document.getElementById('iframeid').src += ''; fonctionne également : jsfiddle.net/Daniel_Hug/dWm5k

4 votes

Et qu'est-ce que vous faites exactement si la source de l'iframe a modifié depuis qu'il a été ajouté à la page ?

0 votes

Cela fonctionne pour moi sur Chrome ver33 ! Il est étrange que l'on ne puisse pas simplement utiliser reload mais cela est autorisé.

63voto

lousygarua Points 231

Si vous utilisez jQuery, cela semble fonctionner :

$('#your_iframe').attr('src', $('#your_iframe').attr('src'));

7 votes

Et ce, sans jQuery : var iframe = document.getElementById("your_iframe"); iframe.src = src;

0 votes

Veuillez noter à toute personne future que cette solution (et la solution js simple) est la meilleure à utiliser, car elle est multiplateforme et fonctionne sur tous les domaines.

14 votes

@Seagrass Je pense que vous voulez dire : var iframe = document.getElementById("your_iframe"); iframe.src = iframe.src;

15voto

scunliffe Points 30964
window.frames['frameNameOrIndex'].location.reload();

8voto

big lep Points 516

En raison de la politique de même origine Cette méthode ne fonctionnera pas si vous modifiez une iframe pointant vers un autre domaine. Si vous pouvez cibler des navigateurs plus récents, envisagez d'utiliser la méthode suivante La messagerie inter-documents de HTML5 . Vous pouvez consulter les navigateurs qui prennent en charge cette fonctionnalité ici : http://caniuse.com/#feat=x-doc-messaging .

Si vous ne pouvez pas utiliser la fonctionnalité HTML5, vous pouvez suivre les astuces décrites ici : http://softwareas.com/cross-domain-communication-with-iframes . Cet article de blog définit également bien le problème.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X