保存并显示上传的图像

时间:2016-08-17 11:05:39

标签: javascript html image input

我有一张已经存在的图片,我想上传一张新图片并替换旧图片,但此代码无效。 (我有一个按钮,其onclick属性是photoSave()。)有人可以告诉这个Javascript代码有什么问题,并且可能会写一个可能的解决方案吗?

这是代码的重要部分:

hostname       result  result1 result2 result3
HOSTNAME=host1 2       2         2      4
HOSTNAME=host2 1       1         1      8
HOSTNAME=host3 1       0         1      7
HOSTNAME=host4 0       0         2      3
HOSTNAME=host6 0       0         1      6

1 个答案:

答案 0 :(得分:0)

当您通过input type="file"上传文件时,该文件尚未保存在您的服务器中。

两种解决方案:

  1. 因此您需要将此文件放在网络上的资源存储库中 服务器。
  2. 或者您可以预览图像,请参阅 Preview an image before it is uploaded
  3. 在你的函数中添加以下js:

        if (input.files && input.files[0]) {
            var reader = new FileReader();
    
            reader.onload = function (e) {
                $('#pictureToShow').attr('src', e.target.result);
            }
    
            reader.readAsDataURL(input.files[0]);
        }
    

    此外,您的图片没有ID属性,因此您需要更改<img src="prof.jpg" />的{​​{1}}。