php中图片文件上传，显示缩略图

htm代码块：

<meta charset="utf-8" />
<style>img {max-width: 100px;max-height: 100px;}input[type="file"] {display: none;}
</style>
<script>function showImage(file, targetId) {var uploadFile = file.files[0];console.log(uploadFile.name);console.log((uploadFile.size / 1024).toFixed(2) + "K");console.log(/(\.jpg|\.jpeg|\.png|\.gif)$/i.test(uploadFile.name));console.log(/\.jpg$|\.jpeg$|\.png$|\.gif$/i.test(uploadFile.name));document.getElementById(targetId).src = window.URL.createObjectURL(uploadFile);}
</script>
<!--文件上传：1、method="post"2、enctype="multipart/form-data"
-->
<form action="upload.php" method="post" enctype="multipart/form-data">File1: <input type="file" id="file1" name="file1" onchange="showImage(this, 'img1')" accept=".gif, .jpg, .jpeg, .png" /><label for="file1"><img id="img1" src="/images/blank.gif" /></label><br />File2: <input type="file" id="file2" name="file2" onchange="showImage(this, 'img2')" accept=".gif, .jpg, .jpeg, .png" /><label for="file2"><img id="img2" src="/images/blank.gif" /></label><br />File3: <input type="file" id="file3" name="file3" onchange="showImage(this, 'img3')" accept=".gif, .jpg, .jpeg, .png" /><label for="file3"><img id="img3" src="/images/blank.gif" /></label><br /><button>Upload</button>
</form>

php代码块：

<pre>
<?php// print_r($_FILES);foreach ($_FILES as $file) {// 判断文件上传组件是否有效if ($file["name"]) {echo "{$file["name"]}<br />";echo "{$file["tmp_name"]}<br />";echo "{$file["type"]}<br />";echo "{$file["size"]}<hr />";// 文件被服务器上传到临时保存目录：$file["tmp_name"]// 这个文件一旦被页面接收，就会自动保存到该路径下，等页面响应完毕，该临时文件就被移除了/*注意：在MacOS中，必须要授予相应目录的操作权限！sudo chmod 777 /private/var/tmpsudo chmod 777 /Users/appleuser/workspace/php/uploads*/move_uploaded_file($file["tmp_name"], "../uploads/{$file["name"]}");}}
?>
</pre>

php中图片文件上传，显示缩略图相关推荐

PDF及普通图片文件上传生成缩略图
主要依赖 <dependency><groupId>cn.hutool</groupId><artifactId>hutool-all</arti ...
PHP报不存在图像文件,使用TP3.2.3图片文件上传显示不存在图像文件
:( 不存在的图像文件错误位置 FILE: D:\wamp64\www\c2\ThinkPHP\Library\Think\Image\Driver\Gd.class.php LINE: 42 TR ...
.Net Core 图片文件上传下载
当下.Net Core项目可是如雨后春笋一般发展起来,作为.Net大军中的一员,我热忱地拥抱了.Net Core并且积极使用其进行业务的开发,我们先介绍下.Net Core项目下实现文件上传下载接口. ...
Office文档上传后实时转换为PDF格式_图片文件上传后实时裁剪_实现在线预览Office文档
Office文档上传后实时转换为PDF格式_图片文件上传后实时裁剪前置条件安装LibreOffice 安装OpenOffice 安装Unoconv 安装ImageMagick.x86_64 安装G ...
antd pro mysql_antd pro table中的文件上传
概述项目中经常会遇到在表格中展示图片的需求(比如展示用户信息时, 有一列是用户的头像). antd pro table 的功能很强大, 对于常规的信息展示只需参照示例配置 column 就可以了. ...
在Struts 2中实现文件上传
前一阵子有些朋友在电子邮件中问关于Struts 2实现文件上传的问题, 所以今天我们就来讨论一下这个问题. 实现原理 Struts 2是通过Commons FileUpload文件上传.Commons ...
Asp.net MVC 1.0 RTM中实现文件上传
Asp.net MVC 1.0 RTM中实现文件上传在我们开始之前,你需要知道一个form以post方式上传文件的方式,你将要增加一个特别的enctype attribute到form标签上,为了这 ...
springmvc图片文件上传接口
springmvc图片文件上传用MultipartFile文件方式传输 Controller package com.controller;import java.awt.image.Buffere ...
在Struts2中实现文件上传(二)
发布运行应用程序,在浏览器地址栏中键入:http://localhost:8080/Struts2_Fileupload/FileUpload.jsp,出现图示页面: 清单7 FileUpload ...

php中图片文件上传，显示缩略图

php中图片文件上传，显示缩略图

htm代码块：

php代码块：

php中图片文件上传，显示缩略图相关推荐

最新文章

热门文章