Question

我正在构建一个用户可以上传图片的网站，然后会显示。我稍后需要将此图像设置为他们的个人资料图片，我对如何做到这一点没有丝毫的线索。谢谢！这是我的代码：

<input id="inp" type='file' accept="image/*"onchange="readURL(this);" /><br>
<img id="blah"/>

<script type="text/javascript">
function readURL(input) {
if (input.files && input.files[0]) {
    var reader = new FileReader();

    reader.onload = function (e) {
        $('#blah')
            .attr('src', e.target.result)
            .width(150)
            .height(150);
    };

    reader.readAsDataURL(input.files[0]);
}
}
</script>

Answer 1

我真的不明白你的问题，你可以将数据保存在变量中，然后在必须发布图像时使用该变量，你应该避免将图像直接存储在数据库中，而是存储对它们的引用。

但是如果你想在选择后只显示图像，你可以这样做：

let input = $('input'),
    img = $('img'),
    reader = new FileReader();

function readFile(e) {
  reader.onload = function(e) {
    img.attr('src', e.target.result)
  }
  
  reader.readAsDataURL(e.target.files[0])
}

input.on('change', readFile)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="inp" type='file' accept="image/*"/>
<img/>

但是，如果您想在数据库上永久保存图像，则必须了解后端的工作方式，并设置Restful API。

获取图像供以后使用

1 个答案: