从服务器获取图像并显示它们
我有个问题。 如果你能指导我,我将不胜感激。 我在服务器上有一些图像。 在我的客户端代码(jQuery)中,我需要从服务器(通过AJAX-php)获取图像(实际图像,而不是服务器上的链接)并在我的页面上显示图像。 当我收到图像时,我不希望它们保存在客户端的硬盘上; 我只是暂时需要它们(也许浏览器可以在短时间内保留它们)。 你能帮我么? 我不知道如何用jQuery / php / Ajax和JSON实现它。
我目前的代码是:
$(document).ready(function () { var phpFileName="serverSide.php"; $.ajaxSetup({ "url":phpFileName, }); $.ajax({ "type":"GET", async: false, "data":{ "newvar1":"value1", }, "success":function(data){ var imageName = data.split('^'); } }); $imageDirOnServer = "some/Diron/Server/"; for(i=0;i<imageName.length;i++){ $("#Cell").append(""); } });
和PHP代码(serverSide.php):
<?php for($k=0;$k
此代码显示01.bmp,02.bmp和03.bmp,它们实际位于我的网页上的服务器上。 我想更改它,以便通过我的网页从服务器获取图像然后显示。 我在页面加载时从服务器获取图像,原因是我不希望在此之后有任何客户端 – 服务器流量。 我提到我不希望将图像保存在客户端计算机上,因为出于安全考虑,我认为不允许(未经用户许可)。 但是,浏览器的缓存对我来说没问题。 谢谢。
我相信你想要的是内嵌图像 。
这可以通过将图像数据放入HTML中来实现,并且可以通过Javascript进行操作。
最终得到的图像标记看起来像这样:
所以你需要做的是设置一个PHP脚本的ajax调用,你可以这样做:
...当你在Javascript中得到响应时,做一些像(例如):
var newImg = document.createElement('img'); newImg.src = xhr.responseText; newImg.alt = 'My alt text'; document.getElementById('some_element_that_exists').appendChild(newImg);
显然上面的代码缺少必要的错误检查等,但希望它能让你开始。
如果一个传球的学生想要jQuery-ify我的Javascript,请随意。
添加到DaveRandom的回复:我想如果你有很多文件,你可能会得到一个巨大的主页面,其中包含许多可能永远不会被使用的“图像代码”。 您可能希望使用ajax获取这些“图像”。
请注意,某些版本的IE不喜欢这些图像。