為什么當我使用URL導航到它時，我的LAMP堆棧會顯示我的圖像，而當我使用jQuery和PHP加載它時卻不顯示我的圖像

Question

我在path/renderer/renderImage.php中有一個php文件，該文件可生成PNG圖像並將其返回到瀏覽器。 當我使用瀏覽器導航到該URL時，它將在屏幕上轉儲正確的圖像。 但是當我嘗試使用下面的path / index.html中的代碼將圖像加載到jQuery的DIV中時...

<!DOCTYPE html>
<html>
    <head>
        <meta charset='utf-8'/>
        ....
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script src="../jquery.colorbox.js"></script>
        <script>
            $.colorbox({
                width:"30%", 
                inline:true, 
                href:"#inline_content",
                onClosed: function() {
                    $("#myPic").load('./renderer/renderPicture.php');
                    $('#myPic').css('display','inline');
                }
            });

它用奇怪的符號填充DIV ...

在此處輸入圖片說明

這是目錄結構的圖片：

在此處輸入圖片說明

為什么瀏覽器在這兩個頁面上對圖片的解釋不同？ 可能導致差異的原因是什么？

Answer 1

您正在獲取符號而不是圖像，因為您嘗試發送二進制數據而不指定該數據是什么。

將標題添加到您的renderPicture.php文件：

header('Content-Type: image/png');

它將返回所需的png圖像。

干杯

Answer 2

jQuery .load方法將加載TEXT / HTML內容並將其插入文檔中。 這正是您遇到的情況，並且是預期的行為。

要通過jQuery加載圖片，您可以使用：

$('<img src="./renderer/renderPicture.php">')

然后利用.load（事件）來做一些事情：

$('<img src="./renderer/renderPicture.php">').load(function() {
    $(this).appendTo('#myPic');
});

看到這里： https : //stackoverflow.com/a/10863680/2327283

為什么當我使用URL導航到它時，我的LAMP堆棧會顯示我的圖像，而當我使用jQuery和PHP加載它時卻不顯示我的圖像

問題描述

2 個解決方案

解決方案1
2 已采納 2013-08-23 05:09:24

解決方案2
1 2013-08-23 05:12:52

為什么當我使用URL導航到它時，我的LAMP堆棧會顯示我的圖像，而當我使用jQuery和PHP加載它時卻不顯示我的圖像

問題描述

2 個解決方案

解決方案1 2 已采納 2013-08-23 05:09:24

解決方案2 1 2013-08-23 05:12:52

解決方案1
2 已采納 2013-08-23 05:09:24

解決方案2
1 2013-08-23 05:12:52