[英]How to upload file on button click
I am trying to upload my file when user clicks the view button as shown in code below. 当用户单击查看按钮时,我正在尝试上传我的文件,如下面的代码所示。 I have tried the following code. 我尝试了以下代码。 Any kind of help is appreciated. 任何帮助都将受到赞赏。 Thank you. 谢谢。
#myInput { width: 50%; padding: 12px 20px 12px 40px; border: 1px solid #000; display: inline-block; } input[type=file]::-webkit-file-upload-button { width: 0; padding: 0; margin: 0; -webkit-appearance: none; -moz-appearance: none; border: none; border: 0px; } x::-webkit-file-upload-button, input[type=file]:after { -webkit-appearance: button; -moz-appearance: button; border-collapse: separate; border-radius: 7px; -webkit-border-radius: 7px; --moz-outline-radius: 7px; content: 'View'; color: #080708; background: #e3e3e3; text-decoration: none; display: inline-block; left: 100%; margin-left: 50px; position: relative; padding: 10px 46px 10px 40px; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="file" name="myInput" id="myInput">
Uploading a file to the server requires of back-end programming, like php for instance, and ideally some JavaScript validation. 将文件上传到服务器需要后端编程(例如php),并且最好进行一些JavaScript验证。 In this particular case CSS is not important as it does not play a roll on the task, only for aesthetics. 在这种特殊情况下,CSS并不重要,因为它仅在美观方面不会发挥作用。
You will need to create: 您将需要创建:
An HTML form that will submit multipart/form-data (enctype), ideally in post (method) to a specific file on the server (action) 一个HTML表单,它将提交multipart / form-data(enctype),理想情况下是将post(方法)提交到服务器上的特定文件(操作)
The file on the server requires of back-end programming like PHP to handle the uploaded file and save it somewhere on the server. 服务器上的文件需要后端编程(如PHP)来处理上传的文件并将其保存在服务器上的某个位置。
I believe with this information you can have a better idea on how to accomplish the task and do more specific research on your end. 我相信借助这些信息,您可以更好地了解如何完成任务并最终进行更具体的研究。
Here is a tutorial that has been around for a while: http://www.tizag.com/phpT/fileupload.php 这是已经存在了一段时间的教程: http : //www.tizag.com/phpT/fileupload.php
Good Luck. 祝好运。
You should put input tag into a form tag like this 您应该将输入标签放入这样的表单标签中
<form action="" enctype="multipart/form-data" method="post">
<input type="file" name="myInput" id="myInput">
<input type="submit" value="submit">
</form>
also you need php(or some else) to restore upload files on your server. 另外,您还需要php(或其他一些方式)来恢复服务器上的上传文件。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.