1

我不确定这是否可能，但我想如果是的话，我会知道的。基本上我使用 ajax-upload 脚本来上传图像，在上传按钮下方显示当前图像的缩略图。

它用于商店产品，因此产品有许多图片，在加载“编辑产品”页面时，所有缩略图都是已经保存到数据库的缩略图。但是，当用户单击上传按钮并选择不同的文件时，我希望显示新图像，但问题是，它尚未插入数据库。

代码如下所示：

<tr>
    <td align="right">Product Thumbnail:</td>
    <td>
     <table>
        <tr>
         <td>
           <div id="upload" >
              <button type="button">Upload</button>
           </div>
         </td>
         <td id="myfilename"></td>
        </tr>
    </table>
   </td>
  </tr>
   <tr>
    <td align="right">Thumb:</td>
    <td align="left">
    <img src="../shop/<?php echo $prodinforow["ProdThumb"]; ?>" width="115" border="0">&nbsp;<a href=""><img src="images/1001-cancel16.gif" width="16" height="16" alt="" border="0"></a>
    <div id="upload"></div>
    </td>
    </tr>

因此，您可以看到 img src 在一个简单的查询中从数据库中得到回显，该查询进一步位于实际页面上，这很好用。我知道上传图像的文件名会在文件上传时保存到一个名为“附件”的隐藏表单输入中。但在提交表单之前。

无论如何我可以在页面提交之前将图片的来源更改为上传的吗？或者任何人都可以用聪明的方法来做到这一点？

4

2 回答 2

2

您可以使用 jQuery 或纯 javascript 来修改 src 属性。您需要为 img 标签提供一个 id 属性，以便将其与其他 img 标签区分开来。这是一个非常基本的示例，您需要使用它才能使其正常工作：

// using jquery, assuming a button with the id "upload_button"
// is pressed when the image is selected
$('#upload_button').click(function() {
    $('img#my_img').attr('src', './path/to/new/image');
});
于 2012-12-04T14:09:08.467 回答
1

给图片一个id，比如

<img id = "my_image" src="../shop/<?php echo $prodinforow["ProdThumb"]; ?>

然后：

在上传按钮的onclick中，输入：

<div onclick="document.getElementById('myImage').src = '/path/to/image'" id="upload"></div>

于 2012-12-04T14:06:35.640 回答