Làm thế nào tôi có thể thiết lập nguồn hình ảnh với base64

Question

tôi muốn thiết lập các nguồn hình ảnh với một nguồn base64 nhưng nó không hoạt động:

JSfiddle.net/NT9KB

<img id="img" src="" /> 

JavaScript

document.getElementById("img").src = "data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUA 
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO 
9TXL0Y4OHwAAAABJRU5ErkJggg==" 

Answer 1

Thử sử dụng setAttribute thay thế:

document.getElementById('img') 
    .setAttribute(
     'src', 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==' 
    ); 

câu trả lời thật: (Và chắc chắn rằng bạn loại bỏ các dòng-chia trong base64.)

Answer 2

img = new Image(); 
img.src = "data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" 
img.outerHTML; 
"<img src="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==">" 

Answer 3

Trong trường hợp bạn muốn sử dụng jQuery để thiết lập hình ảnh từ Base64:

$("#img").attr('src', 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=='); 

Answer 4

vấn đề của bạn là cr (carriage return)

http://jsfiddle.net/NT9KB/210/

bạn có thể sử dụng:

document.getElementById("img").src = "data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="