Javascript: Hủy/Ngừng yêu cầu hình ảnh

Question

Tôi có một trang web sử dụng nhiều Ajax. Thỉnh thoảng tôi cần tải các tệp hình ảnh lớn trên trang cho người dùng. Câu hỏi của tôi là, khi các tệp hình ảnh lớn này đang được tải xuống, có cách nào để ngăn chặn chúng nếu người dùng điều hướng khỏi trang hiển thị hình ảnh không? Cảm ơn.

Answer 1

tôi đã có cùng một vấn đề chính xác, khi nhanh chóng thông qua (ajax) kết quả tìm kiếm 'paged' người sử dụng trình duyệt vẫn cố gắng để tải về hình ảnh hồ sơ cá nhân cho mỗi trang không chỉ là một hiện tại. Mã này đã hoạt động cho tôi, được gọi trên sự kiện nhắn tin ngay trước khi tìm kiếm mới được chạy:

//cancel image downloads 
if(window.stop !== undefined) 
{ 
    window.stop(); 
} 
else if(document.execCommand !== undefined) 
{ 
    document.execCommand("Stop", false); 
} 

Về cơ bản nó giống như nhấp vào nút "Dừng" trên trình duyệt.

Tested trong IE, FireFox, Chrome, Opera và Safari

Answer 2

Giả sử bạn đang sử dụng ajax để tải hình ảnh, bạn có thể chỉ cần hủy yêu cầu trong sự kiện window.onunload. Khai báo một biến toàn cầu cho đối tượng XMLHttpRequest mà bạn đang sử dụng.

var xhr; 
//if using the XMLHttpRequest object directly 
//you may already be doing something like this 
function getImage(...){ 
    xhr = new XMLHttpRequest(); 
    xhr.open(....); 
} 

nếu sử dụng jQuery, bạn có thể gán giá trị trả lại của cuộc gọi bạn $ .ajax() hoặc biến $ .get to xhr.

xhr = $.ajax(.....); 

Xử lý cửa sổ.không tải và hủy yêu cầu.

window.onunload = function(){ 
    xhr.abort(); 
} 

Answer 3

Giải pháp mans nghèo sẽ chỉ đơn giản là thiết lập các thuộc tính của thẻ hình ảnh SRC để một chuỗi rỗng, hoặc trỏ nó hướng tới một widget.

chỉnh sửa

Saw nhận xét của bạn, ngạc nhiên nó không hoạt động với thay đổi thuộc tính SRC để trống ... hãy thử sử dụng một blank.gif hoặc một cái gì đó.

Nếu cách này không hiệu quả, bạn có thể bị ràng buộc bởi kiến ​​trúc trình duyệt, nghĩa là bạn là S.O.L.

Answer 4

Chuyển nhượng thẻ SRC cho một hình ảnh khác không hoạt động trong IE7, nó tiếp tục cố tải xuống hình ảnh đầu tiên.

Đây là thiết lập:

Tôi đã tạo trình xử lý HTTP thuộc loại JPEG. Nó chứa mã không bao giờ kết thúc thực thi. Vì vậy, someImage.src = myhandler.ashx sẽ vĩnh viễn ngồi đó tải cho đến khi nó lần ra ngoài.

Ở giữa này, nhấn nút khác mà reassigns hình ảnh vào một tập tin hình ảnh nhỏ: someImage.src = small.jpg

Yêu cầu myhandler.ashx không kết thúc, mặc dù chúng tôi đã bố trí src.

Hơn nữa, nếu bạn thực sự xóa someImage.parentNode.removeChild nút (someImage) vẫn tiếp tục cố gắng để tải về myhandler.ashx

Thử nghiệm với IE7 và giám sát với HTTP Xem Pro.

Answer 5

như thế này.

$(img).attr('src','');