php怎么实现多图上传

藏色散人
Lepaskan: 2023-03-13 15:36:01
asal
3320 orang telah melayarinya

php实现多图上传的方法:1、创建html代码并加载swfupload组件和flash;2、在php里处理上传并且返回上传图片的地址;3、通过ajax调用php;4、把图片的地址保存到数据库即可。

php怎么实现多图上传

本文操作环境:Windows7系统、thinkphp v5.1版、DELL G3电脑

php怎么实现多图上传?

php实现多图上传的方法:

先上一张图片给大家看看效果,有需要就下载学习。不一定非要在ThinkPHP里,只是我目前是去学习使用ThinkPHP做开发罢了。

0cc1794b573d37626e39bc142c21f15.png

【准备工作】现在需要的东西是,下载一个swfupload.js网上很多,自己百度吧。先说明思路或流程,然后再上代码。

整个多图上传的流程

1.写好html代码,包括上传以后即显示的效果的html代码,以及加载swfupload组件和flash

2.在添加图片以后上传到php里处理上传并且返回上传图片的地址,加载到预览区域里。

3.点击每张图片右上角的 X 以后,ajax调用php的方法去删除预览区域的图片。

4.在添加图片和删除预览区域的图片的同时,都会更改一个隐藏域的值,这样在完成整个上传提交表单以后可以把图片的地址保存到数据库。(看需要)

【代码部分】先写html代码。(css文件就不贴了)

     flash无刷新多图片上传       
    Salin selepas log masuk

    详细说一下swfupload的配置项

    upload_url 是上传图片处理的php地址

    file_size_limit 上传大小限制

    file_upload_limit 限制用户一次性最多上传多少张图片,0为不限制

    file_queue_error_handler

    file_dialog_complete_handler 添加文件上传选择框关闭以后执行的方法

    upload_error_handler 文件上传错误的时候执行的方法

    upload_success_handler 文件上传成功以后执行的方法

    upload_complete_handler 文件上传完成以后执行的方法

    debug: false 想研究swfupload的可以把这个设置为true,调试模式

    接下来就是上传图片的php代码,此处用的TP的上传类,简单,容易懂

    function uploadImg() { import('ORG.Net.UploadFile'); $upload = new UploadFile();// 实例化上传类 $upload->maxSize = 3145728 ;// 设置附件上传大小 $upload->allowExts = array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型 $savepath='./uploads/'.date('Ymd').'/'; if (!file_exists($savepath)){ mkdir($savepath); } $upload->savePath = $savepath;// 设置附件上传目录 if(!$upload->upload()) {// 上传错误提示错误信息 $this->error($upload->getErrorMsg()); }else{// 上传成功 获取上传文件信息 $info = $upload->getUploadFileInfo(); } print_r(J(__ROOT__.'/'.$info[0]['savepath'].'/'.$info[0]['savename'])); }
    Salin selepas log masuk

    上传成功以后,echo或者print_r输出地址,因为它用的是ajax的方式。

    预览区域设置的代码

    function uploadSuccess(file, serverData){ addImage(serverData); var $svalue=$('form>input[name=s]').val(); if($svalue==''){ $('form>input[name=s]').val(serverData); }else{ $('form>input[name=s]').val($svalue+"|"+serverData); } } function addImage(src){ var newElement = "
  • "; $("#pic_list").append(newElement); $("img.button").last().bind("click", del); }
    Salin selepas log masuk

    serverData就是在php里返回的图片地址,在返回以后,直接调用addImage方法,将地址加载到一个ul里。同时更新隐藏域里的值

    删除图片设置

    var del = function(){ // var fid = $(this).parent().prevAll().length + 1; var src=$(this).siblings('img').attr('src'); var $svalue=$('form>input[name=s]').val(); $.ajax({ type: "GET", //访问WebService使用Post方式请求 url: window.url+"/del", //调用WebService的地址和方法名称组合---WsURL/方法名 data: "src=" + src, success: function(data){ var $val=$svalue.replace(data,''); $('form>input[name=s]').val($val); } }); $(this).parent().remove(); }
    Salin selepas log masuk

    ajax方式,提交到php方式,成功则更新隐藏域里的val,并且销毁元素。

    function del() { $src=str_replace(__ROOT__.'/', '', str_replace('//', '/', $_GET['src'])); if (file_exists($src)){ unlink($src); } print_r($_GET['src']); exit(); }
    Salin selepas log masuk

    删除的方法很简单,就是删除ajax提交过来的地址的文件,并且返回删除的地址,ajax会处理并且自动更新隐藏域的val

    整个ThinkPHP+swfupload上传图片的方法就完成了,很简单~

    推荐学习:《PHP视频教程

    Atas ialah kandungan terperinci php怎么实现多图上传. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

    Label berkaitan:
    php
    sumber:php.cn
    Kenyataan Laman Web ini
    Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
    Muat turun terkini
    Lagi>
    kesan web
    Kod sumber laman web
    Bahan laman web
    Templat hujung hadapan
    Tentang kita Penafian Sitemap
    Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!