javascript - ajax：获取图像作为对 php 文件的响应

Question

所以我有一个带有链接的基本 php 页面，当用户单击“图库”链接时，我希望在其中显示内容的主 div 以加载图像网格。

这是我正在做的示例代码：

myreq = new XMLHttpRequest();

myreq.open("GET","my gallery.php",true);
myreq.send(null);
myreq.onreadystatechange = function(){


if (myreq.readyState == 4)
{       
    $("#maindiv").html(myreq.responseText);
}
} 

我得到画廊文件没问题，div但我得到的是标签而不是图像本身。

我正进入（状态：

img src=url alt=text etc

简而言之，我得到了文件中的文本。

Answer 1

您可以通过两种方式处理此问题：

1. 以这种方式修改您的 PHP 代码，它会返回：

   <img src="image.jpg" alt="Image" />
   

   并使用此代码：

   $("#mainDiv").load("my gallery.php");
   

2. 否则，您可以这样做。以这种方式修改您的 PHP 代码，它返回一个图像并以这种方式更改 JavaScript：

   $("#mainDiv").html('<img src="my gallery.php" alt="Image" />');
   

ps：大家都说了，如果你用jQuery的话，就用jQuery的$.ajax或者它的函数吧，不要用XHR！

Answer 2

我想你正在使用 jQuery，你应该试试这个而不是你所有的代码：

$( "#mainDiv" ).load("my gallery.php");

这将通过将远程文件中的所有 HTML 放入 #mainDiv 元素来实现。