顯示圖像

Question

我有以下代碼：

function createImage(source) {     
var pastedImage = new Image();     
pastedImage.onload = function() { 

} 
pastedImage.src = source; 
} 

功能的createImage含有包含的圖像的源的源參數。之後，我創建了類Image的對象pastedImage，並在警告我正在獲取像[object HTMLImageElement]這樣的html圖像元素對象。

我的問題是我如何使用該對象在我的html頁面中顯示圖像。我想在onload函數後顯示它。

在此先感謝。

Answer 1

你也可以這樣做：

function createImage(source) { 
     var pastedImage = new Image(); 
     pastedImage.onload = function() { 

document.write('<br><br><br>Your image in canvas: <img src="'+pastedImage.src+'" height="100" width="200"/>');      

     } 
     pastedImage.src = source;   
    }​ 

Answer 2

你好：工作演示http://jsfiddle.net/wXV3u/

用於API = .htmlhttp://api.jquery.com/html/

在上click me按鈕演示點擊。

希望這會有所幫助！請讓我知道我是否錯過了任何東西！ B-）

代碼

$('#foo').click(function() { 
    createImage("http://images.wikia.com/maditsmadfunny/images/5/54/Hulk-from-the-movie.jpg"); 

}); 

function createImage(source) { 
    var pastedImage = new Image(); 
    pastedImage.onload = function() { 

    } 
    pastedImage.src = source; 
    $(".testimonialhulk").html(pastedImage); 
}​ 

Answer 3

訪問此鏈接：http://www.techrepublic.com/article/preloading-and-the-javascript-image-object/5214317

Answer 4

簡單，更好，使用JavaScript DOM原語（ replaceChild）：

獲取t的父項他的圖像，包含它的div或跨度，並用您使用您的功能創建的新圖像對象替換舊的img標記

var domImgObj = document.getElementById("image"); 

var imgObj = createImage(src); // your function 
imgObj.id = pageimgObj.id; // necessary for future swap-outs 

document.getElementById("container").replaceChild(imgObj,domImgObj);