0

我以前问过这个问题，但我没有得到真正的解决方案。我正在开发一个社交网站。在用户注册页面中，用户有添加照片的规定。我的问题是我想显示图像在点击表单末尾的提交按钮之前，它已由用户上传到一个 div。我搜索了很多，但找不到合适的。

我的html代码是这样的：

 <img src="<?php echo $row_picture;?>" name="picture" class="settingspic"  width="75" height="91" alt="profile pic" name="picture"/><a href="" onclick="return uploadimg()"> Upload</a></li>
 <input type="file" name="file" id="file" style="display:none;" />

我的 JavaScript 代码是：

function uploadimg()
{
 var uploader = document.getElementById('file');
 uploader.click();
 return false;
}

当我单击提交按钮时，图像被插入到数据库中。我希望在用户上传文件时显示图像。

4

1 回答 1

0

这是我在我们网站上使用的。这是为了在上传之前预览图像，即在提交表单之前。你的问题有点不同，但我希望这会有所帮助。

HTML：

<img id="preview_img" style="max-width: 130px; max-height: 130px;" src="http://www.domain.com/images/<?php echo $this->profile_details->photo? $this->profile_details->photo: "default.png"; ?>"/>
<input type="file" id="avatar" name="avatar" onchange="readURL(this);"/>

JavaScript：

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('#preview_img').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}
于 2013-01-24T08:02:14.090 回答