Question

我想编写一个html文件，可以使用gui访问我的计算机上的文件：

https://smallpdf.com/pdf-to-jpg

在黄色框中，它表示＆＃34;选择文件＆＃34;。您可以单击它并从计算机文件系统中选择一个文件。我想做类似的事情，然后能够使用html中的文件。

特别是我希望用户能够选择一个png，然后将其转换为html画布，然后使用该画布进行操作。我希望一切都是本地的，所以不应该像我链接到的网站那样上传任何内容。

如何做到这一点？

由于

很抱歉这还不清楚，我希望html页面处理的所有文件处理都不是由服务器上的某些php处理的。我不希望在那里有一个服务器端组件。如果不可能，请告诉我，再次感谢。

我希望一切都能够脱机工作，这样你就可以拥有html页面，打开它并使用它。

Answer 1

您可以通过此代码实现您想要的目标

<form>
   <input type="file" name="pic" accept=".png" onchange="loadFile(event)">
   <img id="output"/>
</form>

<script>
  var loadFile = function(event) {
     var output = document.getElementById('output');
     output.src = URL.createObjectURL(event.target.files[0]);
  };
</script>

至于用户界面，你需要自己做一个CSS。

Answer 2

也许您可以尝试File Api from Html5，这样您就可以将其加载到本地并进行所需的更改。

Answer 3

您将要学习像PHP这样的服务器端语言来完成此任务。 W3schools有你可以学习的教程。 https://www.w3schools.com/php/php_file_upload.asp

可以加载文件的html / javascript页面

3 个答案: