PHP实现多张图片上传功能的示例代码

首先要知道这个函数

move_uploaded_file();

接下来是我们的input框,和我们的html页面

这里我们是增加的input框我们也可以写写一个属性    multiple="multiple"   这样就可以ctrl多选图片了

<html>
<head><title>多个文件上传表单</title></head>
<body>
<style>
    form{
        margin: 20px;
        padding: 10px;
    }

    #picInput>input{
        display: block;
        margin: 10px;
    }
</style>
<form action="pic.php" method="post" enctype="multipart/form-data">
    <input type="hidden" name="MAX_FILE_SIZE" value="1000000">
    <div id="picInput">
        上传图片:<input type="file" name='myfile[]'>
    </div>
    <input id="addBtn" type="button" onclick="addPic1()" value="继续添加图片"><br/><br/>
    <input type="submit" value="上传文件">
</form>

<script>

    function addPic1(){
        var addBtn =  document.getElementById('addBtn');
        var input = document.createElement("input");
        input.type = 'file';
        input.name = 'myfile[]';
        var picInut = document.getElementById('picInput');
        picInut.appendChild(input);
        if(picInut.children.length == 3){
            addBtn.disabled = 'disabled';
        }
    }
</script>
</body>
</html>

PHP向后台插入图片方法和之前不一样了。

<meta charset="UTF-8">
<?php
$dbhost = 'localhost:3306';  // mysql服务器主机地址
$dbuser = 'root';            // mysql用户名
$dbpass = 'root';          // mysql用户名密码
$conn = mysqli_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
  die('连接失败: ' . mysqli_error($conn));
}
// 设置编码,防止中文乱码
mysqli_query($conn , "set names utf8");
mysqli_select_db( $conn, 'image' );

$file = $_FILES['myfile'];  //得到传输的数据,以数组的形式
$name = $file['name'];      //得到文件名称,以数组的形式
$upload_path = "img/"; //上传文件的存放路径
//当前位置
foreach ($name as $key=>$names){//foreach将$name也就是我们所有图片的name的键值对输出,
    /*
     * strtolower()将内容转为小写,
     * substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符。这个是获取我们name的最后一的路径。要抽取的子串的起始下标。必须是数值。如果是负数,那么该参数声明从字符串的尾部开始算起的位置。也就是说,-1 指字符串中最后一个字符
     *
     *
     */
    $type = strtolower(substr($names,strrpos($names,'.')+1));//得到文件类型,并且都转化成小写
    $allow_type = array('jpg','jpeg','gif','png'); //定义允许上传的类型
    //把非法格式的图片去除
    if (!in_array($type,$allow_type)){//检测图片后缀是否正确
        unset($name[$key]);//函数,参数为name的值也就是图片的name值。
    }
}
$str = '';//空字符串
foreach ($name as $key=>$item){//获取图片的时间;
    $type = strtolower(substr($item,strrpos($item,'.')+1));//得到文件类型,并且都转化成小写
    if (move_uploaded_file($file['tmp_name'][$key],$upload_path.time().$name[$key])){
          $str .= ','.$upload_path.time().$name[$key];//将图片拼接一个当前时间
    }else{
//      echo '错误';
    }
}

//向指定id插入图片地址(虽然是插入,但是是更新字段,不要迷糊了)
$uid = 1;//格式
$str = substr($str,1);//最后的值给$str然后将内容插入数据库
$sql = "INSERT INTO img ".
        "(name) ".
        "VALUES ".
        "('$str')";
$retval = mysqli_query( $conn, $sql );
if(! $retval )
{
  die('无法插入数据: ' . mysqli_error($conn));
}
echo "数据插入成功";
mysqli_close($conn);
?>

插入成功之后然后读取,和之前也不一样。我们要分解字段,然后将我们的图片循环输出出来。

 <meta charset="UTF-8">
<style>
    .image{
        width: 150px;
        height: 150px;
    }
</style>
<?php
$dbhost = 'localhost:3306';  // mysql服务器主机地址
$dbuser = 'root';            // mysql用户名
$dbpass = 'root';          // mysql用户名密码
$conn = mysqli_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
  die('连接失败: ' . mysqli_error($conn));
}
// 设置编码,防止中文乱码
mysqli_query($conn , "set names utf8");
mysqli_select_db( $conn, 'image' );
$sql = 'SELECT name FROM img';//查询数据库内容
$retval = mysqli_query( $conn, $sql );
if(! $retval )
{
    die('无法读取数据: ' . mysqli_error($conn));
}
$picpath = '';//声明空字符串
while($row = mysqli_fetch_array($retval)){
    $picpath = $row[0];//循环我们的第一个字段下面有打印,可查看。
// var_dump($picpath);exit;
}
$picpath = explode(',',$picpath);//分解指示符,将我们一个,分为一个数组。分为一部分。//下面可打印
// var_dump($picpath);exit;
$acs='';//声明空字符串
   for($i=0; $i<count($picpath); $i++){//将$picpath内容,也就是每个图片的路径读取出来。
       $acs=$picpath[$i];//将内容赋给我们的变量空。的字符串。
       echo "<img class='image' src='".$acs."'>";//在img中运行。
   }
mysqli_close($conn);
?>

到此这篇关于PHP实现多张图片上传功能的示例代码的文章就介绍到这了,更多相关PHP多张图片上传内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

时间: 2022-06-08

php实现多张图片上传加水印技巧

复制代码 代码如下: <?php function imageWaterMark($groundImage,$waterPos=0,$waterImage="",$waterText="",$textFont=5,$textColor="#FF0000") { $isWaterImage = FALSE; $formatMsg = "暂不支持该文件格式,请用图片处理软件将图片转换为GIF.JPG.PNG格式."; //读

PHP实现多图片上传类实例

本文所述为一个实用的PHP多图片文件上传类,其支持gif.jpg.jpeg.pjpeg.png格式的多图片上传功能,类中还可限制图片类型.上传图片的大小.设置上传目录.一些提交判断等功能.此外该类并不局限于图片的上传,也可以上传TXT/RAR等文件类型,只是需要对代码进行一下修改,感兴趣的读者可以自己尝试一下. php多图片上传类完整功能代码如下: <?php class more_file_upload{ const FILE_PATH = '/uploadfile/'; //默认文件上传的目

php多个文件及图片上传实例详解

本文实例讲述了php多个文件及图片上传的方法.分享给大家供大家参考.具体实现方法如下: 多个文件上传是在单文件上传的基础上利用遍历数组的方式进行遍历表单数组然后把文件一个个上传到服务器上了,下面就来看一个简单多个文件上传实例 多个文件上传和单独文件上传的处理方式是一样的,只需要在客户端多提供几个类型为"file"的输入表单,并指定不同的"name"属性值.例如,在下面的代码中,可以让用户同时选择三个本地文件一起上传给服务器,客户端的表单如下所示: 复制代码 代码如下

如何利用PHP实现上传图片功能详解

HTML文件 一. 设置编码UTF-8 对于中文网页需要使用<meta charset="utf-8">声明编码,否则会出现乱码. 二 .form表单 <form>标签用于为用户输入创建 HTML 表单,表单里包含php文件路径, <form action="1.php"> 设置编码类型, 需要注意的是:默认情况下,enctype的值是application/x-www-form-urlencoded,不能用于文件上传,只有使用了

PHP实现一个按钮点击上传多个图片操作示例

本文实例讲述了PHP实现一个按钮点击上传多个图片.分享给大家供大家参考,具体如下: test.html 代码如下 <form action="upload.php" method="post" enctype="multipart/form-data"> <p>Pictures:<br /> <input type="file" name="pictures[]"

PHP单文件上传原理及上传函数的封装操作示例

本文实例讲述了PHP单文件上传原理及上传函数的封装操作.分享给大家供大家参考,具体如下: 表单: 0.php: <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> </head> <body> <form action="000.php" method="pos

Jquery+AJAX实现无刷新上传并重命名文件操作示例【PHP后台接收】

本文实例讲述了Jquery+AJAX实现无刷新上传并重命名文件操作.分享给大家供大家参考,具体如下: index.html <!DOCTYPE html> <html> <head> <title>Ajax上传图片</title> <meta charset="utf-8"> <script src="https://www.jq22.com/jquery/jquery-3.3.1.js"

PHP图片上传类带图片显示

这是一个PHP的文件上传类带图片显示的.其实做成函数就可以了.不过还是做成类好玩一点.~~~~ 本来应该用JS来验证上传文件类型的.但懒得做了. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3

Java实现一个简单的文件上传案例示例代码

Java实现一个简单的文件上传案例 实现流程: 1.客户端从硬盘读取文件数据到程序中 2.客户端输出流,写出文件到服务端 3.服务端输出流,读取文件数据到服务端中 4.输出流,写出文件数据到服务器硬盘中 下面上代码 上传单个文件 服务器端 package FileUpload; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.net.Serve

解决vue-quill-editor上传内容由于图片是base64的导致字符太长的问题

vue-quill-editor是个较为轻量级富文本框,相较于ueditor,开发更编辑,更加直观,如果大家伙在需求允许的情况下,还是会比较建议使用vue-quill-editor. vue-quill-editor的使用方法在这边就不多说了,大家网上查下,一抓一大把 但是在使用vue-quill-editor有一个致命的问题,vue-quill-editor默认插入图片是直接将图片转为base64再放入内容中,如果图片比较大的话,富文本的内容就会很大,即使图片不大,只要图片较为多,篇幅较长,富

asp.net文件上传解决方案(图片上传、单文件上传、多文件上传、检查文件类型)

小编之前也介绍了许多ASP.NET文件上传的解决案例,今天来个asp.net文件上传大集合. 1 使用标准HTML来进行图片上传 前台代码: <body> <form id="form1" runat="server"> <div> <table> <tr> <td colspan="2" style="height: 21px" > 使用标准HTML来进

php文件上传、下载和删除示例

php文件上传.下载和删除示例大体思路如下,具体内容如下 一.文件上传 1.把上传文件的区域做出来 div1 2.把显示文件的区域做出来 div2 3.提交表单,上传文件 4.服务器接收文件数据 用$_FILE[name]接收 5.处理数据,看上传文件是否有错误 错误有如下几种: 1).上传的文件超过了 php.ini 中 upload_max_filesize 选项限制的值 2).上传文件的大小超过了 HTML 表单中 MAX_FILE_SIZE 选项指定的值 3).文件只有部分被上传 4).

微信小程序之批量上传并压缩图片的实例代码

具体内容如下所示: 首先,要在.wxml文件里面创建一个canvas,作用是承载压缩的图片,以供上传的时候获取 这个canvas不能隐藏,否则没效果,可以将其移至屏幕外. <canvas canvas-id='attendCanvasId' class='myCanvas'></canvas> 然后呢,就是.js文件里面的方法了 // 点击加_压缩 takePhoto: function () { var that = this; let imgViewList = that.da

Flask实现图片的上传、下载及展示示例代码

用Flask处理图片非常容易,这一篇学习一下图片的上传.下载及展示.还是以实例代码演示为主. 首先,实现一个简单的上传(过程中未做任何处理,只是为了演示) 点击选择图片,输入李四: HTML代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> &l