0

免责声明：这是一个任务。我不是要求明确的代码。我只想要足够的信息，以便我可以理解手头的任务并学习相关部分。

我正在做一项任务，要求我通过表单接受姓名和图片，将两者放入数据库，然后在表单下方显示数据库中的所有姓名。名称应该是可点击的，点击后，在名称下方的 div 中显示它们各自的图片。

我已经足够将名称和图像存储在数据库中（我知道，将图像存储在数据库中很糟糕，但这是任务的一部分。）我必须完成的最后一部分是链接和图像显示。

我决定以一种相当鲁莽的方式为每个名称赋予其自己的 div：

for ($i = 0; $i < $nrows; $i++) {
    $name = htmlspecialchars(mysql_result($results, $i, "first_name")). " " .htmlspecialchars(mysql_result($results, $i, "last_name"));
    echo "<div id='".$name."'>";
    echo $name;
    echo "</div>";
}

所以这就像一个表格，除了每个 div 都有一个唯一的 ID（人的名字，虽然我可以将其更改为数字 ID。）我认为为每个 div 提供点击功能是相当基本的，基于它的唯一ID，但我不确定是否应该在循环范围内或外部执行此操作...

此外，我不完全确定如何设置单击功能来选择特定名称的图像。每个图像都存储为 LONGBLOB，因此需要在显示之前将其编码为图像形式。我知道 base64_encode 应该适用于此，但我似乎无法将它放在我的脑海中。

如果您需要更多我的代码，请告诉我 - 我很乐意提供。否则，感谢您的时间和帮助。

编辑#1（上午 11:44，2/18/13）：

$('#$name').click(function() {
    $("#image-div").html("<img src='data:image/jpeg;base64,'.base64_encode(mysql_result($results, $i, 'photo')).'>");
});
4

2 回答 2

1
  1. 给 div 一个类，然后你可以jQuery.on通过类选择器来分配你的点击处理程序
  2. 要检索您的图像，您需要创建一个控制器以使用正确的内容类型标头将图像向下推送到客户端；这使您的图像标签看起来像：<img src="image.php?name=theimagename" />

更新：

您不想将 id 直接放在 js 中……您想使用可以从处理程序中获得的某种属性。例如：

<div id="theimagename" data-image-id="1">
</div>

然后从处理程序中，您可以获得的值data-image-id并将其发送到 php.ini。

于 2013-02-18T19:47:35.570 回答
0

对于每个<div id="name">，还添加onclick如下处理程序：

<div onclick="getImage(this.id)" id="name">

那么该getImage()函数可以具有以下内容：

function getImage(name){
  console.log(id)
  //Now you have the name of the image you need
}
于 2013-02-18T19:49:15.540 回答