本文实例讲述了PHP实现上传多图即时显示与即时删除的方法。分享给大家供大家参考,具体如下:

PHP实现上传多图即时显示与即时删除的方法

就像这样的,每选择一个图片就会即时显示出来,附加到右边,也可以随意删除一个元素。

其实是,当type=file的input框框的onchange事件===》》》post数据提交到隐藏的ifram(form表单的target指定)===》》》接收到post数据的直接 echo    script标签来返回数据到前端页面并且赋值,然后存储图片路径也是用隐藏域实现:

HTML:

<!doctype html>
<html lang="cn">
<include file="Public/head"/>
<body>
<include file="Public/nav"/>
<iframe name="upload_url" style="display:none"></iframe>
   <div class="wlog">
     <div class="wlog_t cf">
       <b>写日志</b>
     </div>
     <div class="wlog_c">
       <form class="cf" id="myform" target="" enctype="multipart/form-data" action="" method="post">
         <div class="wlog_l">
           <textarea id="content" name="data[content]"></textarea>
           <input type="hidden" id="step" value="1" name="data[step]" />
         </div>
         <div class="wlog_r">
           <h2>选择装修阶段</h2>
           <b class="cur" mine="1" style="line-height:20px;">准备开工</b>
           <b mine="2" >水电</b>
           <b mine="3">泥木</b>
           <b mine="4">油漆</b>
           <b mine="5">竣工</b>
           <b mine="6">软装</b>
           <!-- <input type="hidden" value="准备开工"> -->
         </div>
         <div class="wlog_f cf">
           <h2><b>上传图片</b>选择装修过程中的照片,每张低于5M,支持JPG/JPEG/PNG格式,最多9张</h2>
           <div class="wlog_p cf">
             <a href="javascript:;" rel="external nofollow" ><img src="/UploadFiles/2021-04-02/2016-10-29_231703.png">

控制器(返回被选中的图片(已经上传)在服务器之中的路径):

public function submitimg(){
    if(IS_POST){
        $data = I('post.data');//获取post数据
        $res = fab_upload($_FILES);//上传文件
        $uid=uniqid();
        $res=$res['thumb'];
        if($res){
          echo "<script>parent.callblack_img('{$res}','{$uid}');</script>";
        }
     }
}

真正的最后接收表单数据并且存入数据库的函数:

public function add_journal(){
     if(IS_POST){
         var_dump($_POST);die;
       }else{
        $this->display();
     }
}

更多关于PHP相关内容感兴趣的读者可查看本站专题:《php文件操作总结》、《PHP图形与图片操作技巧汇总》、《PHP网络编程技巧总结》、《php面向对象程序设计入门教程》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总》

希望本文所述对大家PHP程序设计有所帮助。

华山资源网 Design By www.eoogi.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
华山资源网 Design By www.eoogi.com