如何顯示來自ajax成功函數的圖像？

Question

我已經創建了像這樣的ajax函數...在這裏，我將從運行時獲得值，並且我需要根據該值返回照片。在成功函數中，我需要顯示該圖像的細節div

var num=document.getElementById('number').value; 
$.ajax({ 
    url:"image.php?val="+num, 
    contentType: "image/png", 
    success:function(img) 
    { 
     $('#image').html('<img src="data:image/png;base64,' + img + '" />'); 
    } 
    }); 

image.php頁

$sql_sub = select_query("select pic from photo where picnum=".$_GET['val'].""); 
$img = $sql_sub[0][0]->load(); 
header("Content-type: image/png"); 
ob_start(); 
imagepng($img); 
echo "data:image/png;base64,", base64_encode(ob_get_clean()); 

Answer 1

var num=document.getElementById('number').value; 
$.ajax({ 
url:"image.php?val="+num, 
type: "POST", 
dataType: "html", 
success:function(img) 
{ 
    $('#image').html('<img src="data:image/png;base64,' + img + '" />'); 
} 
}); 

image.php

$sql_sub = select_query("select pic from photo where picnum=".$_GET['val'].""); 
$img = $sql_sub[0][0]->load(); 
header("Content-type: image/png"); 
ob_start(); 
echo $img; 
echo "data:image/png;base64,", base64_encode(ob_get_clean()); 

Answer 2

它看起來perfect..You可能會出現問題的標籤。首先檢查該標籤。然而.append工程很好。

你有沒有嘗試過這樣的：

$('body').append('<img src="https://chart.googleapis.com/chart?cht=qr&chs=200x200&chl=http%3a%2f%2fwww.facebook.com" />'); 

$('#div_where_you_will_sho_qr_code').append(data.toString()); 

或：

$('#container').html('<img src="https://chart.googleapis.com/chart?cht=qr&chs=200x200&chl=http%3a%2f%2fwww.facebook.com" />'); 

其中#container的一些DOM元素懷有你的形象。

或方式，我喜歡：

$('#container').html(
    $('<img/>', { 
     src: 'https://chart.googleapis.com/chart?cht=qr&chs=200x200&chl=http%3a%2f%2fwww.facebook.com', 
     alt: '' 
    }) 
); 

Answer 3

var num=document.getElementById('number').value; 
$.ajax({ 
    url:"image.php?val="+num, 
    type: "POST", 
    dataType: "html", 
    success:function(data) 
    { 
     $('#image').html(data)); 
    } 
    }); 

image.php

$sql_sub = select_query("select pic from photo where picnum=".$_POST'val'].""); 
$img = $sql_sub[0][0]->load(); 
$image = '<img src="data:image/png;base64,'.$img.'" />'; 
echo $img;