Question

我在此HTML页面上拥有默认图像，如果您单击“浏览”按钮，则图像将变为您选择打开的图像。现在，所选图像显示在HTML中，但仍必须保存在“ / images”项目文件夹中。

到目前为止，这是我的代码。我已经研究了几天，到目前为止，我一直尝试的所有方法都无效。另外，我是HTML和JS的新手，所以如果有任何初学者的错误，请原谅。关于我需要添加到js代码中的任何想法？

html：

 <div class="cc-profile-image"><a href="#"><img src="images/photo.png" alt="Image"/></a></div><!--ORIGINAL PHOTO-->

      <form action="images/photo.png" onchange="previewFile()" >
        Select image to upload:
        <input type="file" name="file" id="file" value>
        <label for="file"> Select a file to upload</label> 
        <input type="submit" value="Subir">
      </form>

js：

function previewFile(){
          var preview = document.querySelector('img'); //selects the query named img
          //preview.height = "512";
          //preview.width = "512";
          var file    = document.querySelector('input[type=file]').files[0]; //sames as here
          //file.height = "512";
          //file.width = "512";
          var reader  = new FileReader();

          reader.onloadend = function () {
              preview.src = reader.result;
          }

          if (file) {
              reader.readAsDataURL(file); //reads the data as a URL
          } else {
              preview.src = "";
          }
        }

PS：我没有使用任何数据库，我只想将上传的照片存储到/ images。

Answer 1

您不需要数据库。但是只有服务器端脚本语言才能做到这一点。否则，您可以将其存储在客户端。 Javascript无法在服务器端存储文件。它可以上传到接受文件的控制器[无论处理http请求的是什么]，然后由控制器负责保存文件。

这是一个相关的答案。仅将文本文件保存在服务器端。 Saving a text file on server using JavaScript

否则，您可以使用浏览器的缓存，这是该链接。 JavaScript: Create and save file

如何使用javascript

1 个答案: