首页 > 编程 > PHP > 正文

PHP多图片上传实例demo

2020-03-22 20:29:48
字体:
来源:转载
供稿:网友
  • upload.html

    <!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.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="http://c.mfniu.com/js/lib/jquery.js"></script>
    <title>多图片上传实例1</title>
    </head>

    <body>
    <div class="upload_btn" onclick="fileElem.click()">选择上传图片</div>
    <form action="upload.php" method="post" enctype="multipart/form-data">
    <div id="filebox">
    <input class="inputimg" type="file" id="fileElem0" name="img[]" multiple="multiple" accept="image/*" onchange="handleFiles(this)">
    </div>
    <div class="showimgdiv" id="fileList" ></div>
    <br><input class="inputimg" type="submit" value="提交">
    </form>
    <script>
    window.URL = window.URL || window.webkitURL;
    var fileList = document.getElementById("fileList");
    var num = 0;

    function handleFiles(obj) {
    var sname = 'fileElem'+num;
    num++;
    var xname ='fileElem'+num;

    $('#'+sname).hide();
    $('#filebox').append('<input class="inputimg" type="file" id="'+xname+'" name="img[]" multiple="multiple" accept="image/*" onchange="handleFiles(this)">');

    if(fileList.childNodes.length>=6){
    alert("最多只能上传6张图片哦!");
    return false;
    }

    /* 方法2
    if(num>5){
    alert("最多只能上传6张图片哦!");
    return false;
    }
    */

    var files = obj.files,
    img = new Image();

    var div = document.createElement("div");//创建一个DIV
    div.style.width = "100px";
    div.style.height = "100px";
    div.style.border = "1px solid #111";
    div.style.margin = "2px";
    div.style.float = "left";
    div.style.boxShadow = " 2px 2px 4px #aaa";


    img.src = window.URL.createObjectURL(files[0]);
    img.style.width = "100px";
    img.style.height = "100px";
    img.name="img[]";
    img.onload = function(e) {
    window.URL.revokeObjectURL(this.src);
    }

    div.appendChild(img);
    fileList.appendChild(div);
    }
    </script>
    </body>
    </html>

    upload.php

    <?php

    var_dump($_FILES);

    PHP编程

    郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

  • 发表评论 共有条评论
    用户名: 密码:
    验证码: 匿名发表