Me gustaría recargar un <iframe> utilizando JavaScript. La mejor manera que encontré hasta ahora fue establecer el iframe src atribuirse a sí mismo, pero esto no es muy limpio. ¿Algunas ideas?
¿Cuál es la mejor manera de recargar/actualizar un iframe?
⏰ 3 minutos de lectura
café
ed.
document.getElementById('some_frame_id').contentWindow.location.reload();
cuidado, en Firefox, window.frames[] no se puede indexar por id, sino por nombre o índice
-
En realidad, este enfoque no funcionó para mí en Chrome. No había ninguna propiedad ‘contentWindow’. Aunque era posible usar document.getElementById(‘some_frame_id’).location.reload(); El método que funcionó tanto para FF como para Chrome fue document.getElementById(‘iframeid’).src = document.getElementById(‘iframeid’).src
– Mike Bevz
11 de agosto de 2011 a las 13:09
-
@MikeBevz ¿también se puede acceder a location.reload usando el selector Jquery?
– Jitender Mahlawat
21 de noviembre de 2012 a las 10:11
-
absoluto, funciona, pero se atasca con la misma política de origen de dominio ==a
–Bobby Stenly
19 de marzo de 2013 a las 6:32
-
frames[1].location.href.reload()ywindow.frames['some_frame_id'].location.href.reload()también puede ser usado– Daniel W. Crompton
28 de septiembre de 2013 a las 8:53
-
Si no puede acceder a la ventana de iframe, debe cambiar el atributo src de la etiqueta de iframe.
– Maciej Krawczyk
1 de junio de 2016 a las 12:42
-
Esto, sin jQuery:
var iframe = document.getElementById("your_iframe"); iframe.src = src;– pastos marinos
14/07/2014 a las 19:20
-
Tenga en cuenta a las personas futuras que esto (y la solución js simple) son los mejores para usar, ya que es multiplataforma y funciona en todos los dominios.
– mirhagk
22 de septiembre de 2015 a las 18:18
-
@Seagrass Creo que quieres decir:
var iframe = document.getElementById("your_iframe"); iframe.src = iframe.src;– maxismo
14 de febrero de 2016 a las 1:33
Simplemente reemplazando el src El atributo del elemento iframe no fue satisfactorio en mi caso porque uno vería el contenido anterior hasta que se cargue la nueva página. Esto funciona mejor si desea dar retroalimentación visual instantánea:
var url = iframeEl.src;
iframeEl.src="https://stackoverflow.com/questions/86428/about:blank";
setTimeout(function() {
iframeEl.src = url;
}, 10);
-
Acabo de probar el mismo enfoque pero sin setTimeout, y funcionó para mí. en realidad, solo iframe.setAttribute(‘src’, iframe.getAttribute(‘src’))
– bombones
11 mayo 2016 a las 15:56
Utilizando self.location.reload() recargará el iframe.
<iframe src="https://vivekkumar11432.wordpress.com/" width="300" height="300"></iframe>
<br><br>
<input type="button" value="Reload" onclick="self.location.reload();" />-
Acabo de probar el mismo enfoque pero sin setTimeout, y funcionó para mí. en realidad, solo iframe.setAttribute(‘src’, iframe.getAttribute(‘src’))
– bombones
11 mayo 2016 a las 15:56
Agregue espacio vacío y también vuelva a cargar el iFrame automáticamente.
document.getElementById('id').src += '';
-
Esta es la mejor respuesta porque funciona en todos los iframes, incluidos los iframes de origen cruzado. Por el contrario, el
contentWindow.location.reload()El enfoque solo funciona en iframes del mismo origen.– BinaryNate
22 de agosto de 2021 a las 20:57
-
Pero este último no se desplaza hacia arriba, por lo que depende de sus prioridades.
– Serguéi Orshanskiy
16 oct 2021 a las 18:34
¿Ha sido útil esta solución?
Tu feedback nos ayuda a saber si la solución es correcta y está funcionando. De esta manera podemos revisar y corregir el contenido.
¿Hay alguna razón por la cual establecer el
srcatributo a sí mismo no está limpio? Parece ser la única solución que funciona en todos los navegadores y en todos los dominios.– mirhagk
22/09/2015 a las 18:21
Configuración de la
srcatributo a sí mismo causa problemas si tiene un enlace en otro lugar que se dirige a la<iframe>. Luego, el marco mostrará la página inicial como se diseñó originalmente.–E. van Putten
11 de junio de 2020 a las 8:57
Configuración de la
srcEl atributo desplaza el iframe hasta la parte superior de la página, location.reload() no lo hace. Si está recargando porque, por ejemplo, el CSS subyacente al iframe ha cambiado, lo último sería preferible.– Serguéi Orshanskiy
16 oct 2021 a las 18:33