¿El cambio del atributo src de una imagen impide que la imagen se descargue?

Question

Digamos que tengo dos pestañas de acordeón. El primero carga cientos de imágenes y está abierto cuando se carga la página.

Quiero ser capaz de detener las imágenes de la descarga si el usuario hace clic en la segunda pestaña acordeón. ¿El cambio de los atributos src de las imágenes a través de js detendrá la descarga de las imágenes? ¿O las solicitudes solo continúan hasta su finalización y no aparecen en la página?

Answer 1

Tengo un script que carga el logotipo de SO en exactamente 3 segundos que había hecho para otra pregunta.

http://alexturpin.net/slowimage/slowimage.php

Al usarlo, me trataron de reproducir el problema:

var img = new Image(); 
img.onload = function() { 
    alert("loaded"); 
}; 
img.src ="http://alexturpin.net/slowimage/slowimage.php"; 

setTimeout(function() { 
    img.src = ""; 
}, 1000); 

http://jsfiddle.net/Xeon06/RrUvd/1/

Por lo que sé, en Chrome, el onload no recibe disparó, pero el navegador sigue mostrando un spinner y si voy a la pestaña de red y encuentro mi imagen y verifico su contenido, está ahí. Entonces mi respuesta sería no, la imagen aún se carga, al menos en Chrome.

Este es un problema interesante, te recomiendo que pruebes y probarlo en el mayor número de navegadores posible y escribir algún tipo de entrada de blog en él.

Answer 2

No estoy seguro si lo hará, al igual que los otros comentarios. Pero puedo sugerir un enfoque que funcionará bien. Suponiendo que no todas las imágenes son visibles, simplemente configure el atributo src correcto cuando se vuelvan visibles.

Así que por defecto la url a myGray.gif cuando no está visible y lo establece en myImage.jpg cuando aparece.

Cuando cierra el acordeón actual, puede volver a configurar la fuente de imagen en su gif liviano. (Esto evita un error relacionado con gc en algunas versiones del ipad).

Answer 3

Su navegador pregunta esa imagen con una solicitud HTTP GET específica, como especificada en protocolo HTTP. Una vez que lo solicita, el servidor http inicia la transferencia.

Por lo tanto, se encuentra entre el navegador (como cliente http) y el servidor http.

Dado que el protocolo http no tiene en cuenta la opción de cancelar una transferencia , el navegador debe implementar un mecanismo fuera de estándar en para abortar la conexión mediante programación. Pero como esto no está especificado en en ningún estándar, creo que no encontrará ninguna forma de hacerlo con javascript o cualquier código del lado del cliente.

---

Usted puede intentar window.stop() para detener todas las solicitudes, pero no individual queridos.

---

Si quisiera dejar de una única solicitud de una imagen de gran tamaño, lo que podría hacer es cargar la imagen en un documento dentro de un iframe oculto. El evento de carga del IFRAME se puede utilizar para cargar la imagen en el documento principal , momento en el que debe almacenarse en caché (suponiendo que tiene las directivas de caché configuradas para hacerlo).

Si la imagen tarda demasiado, puede acceder al contentWindow de IFRAME y emitir un comando de detención para eso.

Necesita tener tantos elementos IFRAME como imágenes que pueden solicitarse simultáneamente.

toman directamente de here & here.