HTML/Javascript xoá dữ liệu từ img src thuộc tính

Question

Tôi có một img trống trong trang <img ... src=""/>

Khi một sự kiện xảy ra tôi đặt thuộc tính img đến một inline png tôi dữ liệu:

<img ... src="data:image/png;base64,..."/>

Khi một sự kiện khác xảy ra tôi đặt src thành không có gì (loại bỏ img): myImg.src = ""

Vấn đề là: img không tải lại khi tôi đặt src thành không có gì. Nếu tôi ẩn img, hãy đợi một lúc và hiển thị lại nó hoạt động nhưng đó là một hack xấu xí ...

PS: Tôi không muốn đặt hình ảnh 'trống' mặc định tôi cần nó thực sự trống (src = "").

Edit: javascript của tôi:

biometria.setImage = function(png) { 
    if(png) 
     bioCanvas.src = 'data:image/png;base64,' + png; 
    else 
     bioCanvas.src = ''; 
}; 

Edit2: Trình duyệt: Google Chrome 18.0.1025.162 Ubuntu 12.04

Answer 1

Về mặt kỹ thuật, một thẻ hình ảnh bắt buộc phải có một thuộc tính src VÀ nó là vụ phải KHÔNG trống rỗng. Tuy nhiên, W3C specification không rõ ràng về cách xử lý các trường hợp khi thuộc tính src trống. Kết quả là, mọi trình duyệt đều xử lý tình huống này hơi khác nhau.

Có thực sự là một vài vấn đề có thể phát sinh từ sự thiếu thông số này, bạn chỉ là một trong số đó. Một cái nhìn chi tiết hơn về vấn đề này có thể được tìm thấy here.

Như những người khác đã chỉ ra, nên ẩn/hiển thị hình ảnh qua CSS (hiển thị: không nếu bạn muốn giữ không gian bị chiếm đóng hoặc hiển thị: không nếu bạn muốn hình ảnh biến mất hoàn toàn) . Ngoài ra, bạn có thể chỉ cần xóa thẻ hình ảnh hoàn chỉnh bằng cách sử dụng JS và tạo một hình ảnh mới khi bạn muốn chèn nó trở lại.

Answer 2

Tôi đề nghị bạn thay thế hình ảnh bằng hình mới. Trong jQuery bạn có thể làm một cái gì đó như:

$('#yourImage').replaceWith('<img src="" id="yourImage" />'); 

Answer 3

tôi xử lý vấn đề này theo mã thổi và làm việc cho tôi:

document.getElementById('tst').removeAttribute('src');