zoukankan      html  css  js  c++  java
  • PHP实现多图片上传

    PHP实现多图片上传

    今天在工作中遇到了一个需求:一个表单实现多个上传图片,类似于QQ空间上传照片的模式。即:可以一次性上传多个图片,但是封面图片只有一个。

    最先,最重要的事,在服务器上对文件进行读写操作的时候,一定要看权限,如果没有权限,全是虾扯蛋,为什么这样说,因为全是泪。

    首先,前端页面:index.html

    <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>

    知识点:

    1.通过JS动态添加input结点和设置属性,当大于3个上传图片的时候就不再给予上传图片的机会了。

    2.这里最主要的是input输入框的name值,通过动态的添加数组元素,将所有上传的图片动态添加到数组当中。

    后端处理功能

    Connection.php

    1.读取和存储都需要用到连接数据库,所以可以把它封住一下,养成良好的习惯

    <?php
    //创建对象并打开连接,最后一个参数是选择的数据库名称
    $mysqli = new mysqli('localhost','root','','test');
    //检查连接是否成功
    if (mysqli_connect_errno()){
        //注意mysqli_connect_error()新特性
        die('Unable to connect!'). mysqli_connect_error();
    }

    pic.php处理功能

    <?php
    require_once 'connection.php';
    $file = $_FILES['myfile'];  //得到传输的数据,以数组的形式
    $name = $file['name'];      //得到文件名称,以数组的形式
    $upload_path = "zhouqi666.cn/test/images/"; //上传文件的存放路径
    //当前位置

    foreach ($name as $k=>$names){
        $type = strtolower(substr($names,strrpos($names,'.')+1));//得到文件类型,并且都转化成小写
        $allow_type = array('jpg','jpeg','gif','png'); //定义允许上传的类型
        //把非法格式的图片去除
        if (!in_array($type,$allow_type)){
            unset($name[$k]);
        }
    }
    $str = '';
    foreach ($name as $k=>$item){
        $type = strtolower(substr($item,strrpos($item,'.')+1));//得到文件类型,并且都转化成小写
        if (move_uploaded_file($file['tmp_name'][$k],$upload_path.time().$name[$k])){
            //$str .= ','.$upload_path.time().$name[$k];
            echo 'success';
        }else{
            echo 'failed';
        }
    }

    //向指定id插入图片地址(虽然是插入,但是是更新字段,不要迷糊了)
    $uid = 1;
    $str = substr($str,1);
    $sql = "UPDATE upload set pic = '".$str."' WHERE id = ".$uid;
    $result = $mysqli->query($sql);

    这里我有很多的判断没有写,主要是实现一下功能,比如文件夹要先建立好,你也可以自己判断,不存在就创建一个文件夹,还有一些其他判断等等。

    最关键的地方是,当你不熟悉的时候,要走一步调试一步,看得到的结果是什么。

    图片现实功能

     

    <?php
    require_once 'connection.php';
    $uid = 1;
    $sql = "SELECT pic FROM upload WHERE id =".$uid;
    $result = $mysqli->query($sql);
    //取出第一个图片的地址
    $picpath = '';
    while ($row = $result->fetch_array()){
        $picpath = $row[0];
    }
    $picpath = explode(',',$picpath)[0];

    echo "<img src='".$picpath."'>";
    ?>

     

  • 相关阅读:
    在 jQuery Repeater 中为多个字段排序
    使用 AjaxManager 生成调用服务器端方法的 javascript 函数
    使用 JQueryElement ResponseProgress 显示页面执行进度
    (原创)反ARP攻击的绝招,让你在ARP的炮雨攻击下永不掉线
    (原创)最详细可靠的Cadence16.01破解crack和安装方法步骤
    (原创)PCI总线特性及信号说明
    (原创)Modelsim的“The system date appears to have been set back.Cannot continue”问题的解决办法
    爱你哦
    为ASP.NET封装的SQL数据库访问类
    JavaScript中的高级特性及特别对象、属性和方法
  • 原文地址:https://www.cnblogs.com/zhouqi666/p/6066363.html
Copyright © 2011-2022 走看看