PHP仿微信多图片预览上传实例代码
更新时间:2016年10月2日 16:17 点击:1461
生产图片区域,上传按钮#btn可替换自己想要的图片
<ul id="ul_pics" class="ul_pics clearfix"> <li><img src="logo.png" id="btn" class="img_common" /></li> </ul>
plupload上传
var uploader = new plupload.Uploader({//创建实例的构造方法 runtimes: 'html5,flash,silverlight,html4', //上传插件初始化选用那种方式的优先级顺序 browse_button: 'btn', // 上传按钮 url: "ajax.php", //远程上传地址 flash_swf_url: 'plupload/Moxie.swf', //flash文件地址 silverlight_xap_url: 'plupload/Moxie.xap', //silverlight文件地址 filters: { max_file_size: '10mb', //最大上传文件大小(格式100b, 10kb, 10mb, 1gb) mime_types: [//允许文件上传类型 {title: "files", extensions: "jpg,png,gif,jpeg"} ] }, multi_selection: true, //true:ctrl多文件上传, false 单文件上传 init: { FilesAdded: function(up, files) { //文件上传前 if ($("#ul_pics").children("li").length > 30) { alert("您上传的图片太多了!"); uploader.destroy(); } else { var li = ''; plupload.each(files, function(file) { //遍历文件 li += "<li id='" + file['id'] + "'><div class='progress'><span class='bar'></span><span class='percent'>0%</span></div></li>"; }); $("#ul_pics").prepend(li); uploader.start(); } }, UploadProgress: function(up, file) { //上传中,显示进度条 var percent = file.percent; $("#" + file.id).find('.bar').css({"width": percent + "%"}); $("#" + file.id).find(".percent").text(percent + "%"); }, FileUploaded: function(up, file, info) { //文件上传成功的时候触发 var data = eval("(" + info.response + ")");//解析返回的json数据 $("#" + file.id).html("<input type='hidden'name='pic[]' value='" + data.pic + "'/><input type='hidden'name='pic_name[]' value='" + data.name + "'/><img class='img_common' onclick=delPic('" + data.pic + "','" + file.id + "') src='" + data.pic + "'/>");//追加图片 }, Error: function(up, err) { //上传出错的时候触发 alert(err.message); } } }); uploader.init();
ajax删除上传的图片
function delPic(pic, file_id) { //删除图片 参数1图片路径 参数2 随机数 if (confirm("确定要删除吗?")) { $.post("del.php", {pic: pic}, function(data) { $("#" + file_id).remove() }) } }
本文为原创文章,如需转载,请注明来源sucaihuo.com并保留原文链接:http://www.sucaihuo.com/js/830.html
上一篇: PHP自定义函数格式化json数据示例
下一篇: PHP入门教程之面向对象基本概念实例分析
相关文章
- 这篇文章主要介绍了源码分析系列之json_encode()如何转化一个对象,对json_encode()感兴趣的同学,可以参考下...2021-04-22
- PHP去除html、css样式、js格式的方法很多,但发现,它们基本都有一个弊端:空格往往清除不了 经过不断的研究,最终找到了一个理想的去除html包括空格css样式、js 的PHP函数。...2013-08-02
- index.php怎么打开?初学者可能不知道如何打开index.php,不会的同学可以参考一下本篇教程 打开编辑:右键->打开方式->经文本方式打开打开运行:首先你要有个支持运行PH...2017-07-06
PHP中func_get_args(),func_get_arg(),func_num_args()的区别
复制代码 代码如下:<?php function jb51(){ print_r(func_get_args()); echo "<br>"; echo func_get_arg(1); echo "<br>"; echo func_num_args(); } jb51("www","j...2013-10-04- 这篇文章主要介绍了PHP编程 SSO详细介绍及简单实例的相关资料,这里介绍了三种模式跨子域单点登陆、完全跨单点域登陆、站群共享身份认证,需要的朋友可以参考下...2017-01-25
- 这篇文章主要介绍了PHP实现创建以太坊钱包转账等功能,对以太坊感兴趣的同学,可以参考下...2021-04-20
- 这篇文章主要为大家详细介绍了php微信公众账号开发之五个坑,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2016-10-02
ThinkPHP使用心得分享-ThinkPHP + Ajax 实现2级联动下拉菜单
首先是数据库的设计。分类表叫cate.我做的是分类数据的二级联动,数据需要的字段有:id,name(中文名),pid(父id). 父id的设置: 若数据没有上一级,则父id为0,若有上级,则父id为上一级的id。数据库有内容后,就可以开始写代码,进...2014-05-31- 这篇文章主要介绍了PHP如何通过date() 函数格式化显示时间,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下...2020-11-13
- 今天我给大家分享的是在不刷新页面的前提下,使用PHP+jQuery+Ajax实现多图片上传的效果。用户只需要点击选择要上传的图片,然后图片自动上传到服务器上并展示在页面上。...2015-03-15
- 这篇文章主要介绍了golang与php实现计算两个经纬度之间距离的方法,结合实例形式对比分析了Go语言与php进行经纬度计算的相关数学运算技巧,需要的朋友可以参考下...2016-07-29
- 这篇文章主要介绍了PHP正则表达式过滤html标签属性的相关内容,实用性非常,感兴趣的朋友参考下吧...2016-05-06
- 这篇文章主要为大家详细介绍了php构造方法中析构方法在继承中的表现,感兴趣的小伙伴们可以参考一下...2016-04-15
- 这篇文章主要介绍了thinkPHP中多维数组的遍历方法,以简单实例形式分析了thinkPHP中foreach语句的使用技巧,需要的朋友可以参考下...2016-01-12
- 这篇文章主要介绍了PHP如何使用cURL实现Get和Post请求,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下...2020-07-11
- 经常看到有人踩在了PHP路径的坑上面了,感觉有必要来说说PHP中相对路径的一些坑,以及PHP中绝对路径的使用,下面一起来看看。 ...2016-08-24
- 这篇文章主要介绍了php有序列表或数组中删除指定的值的实现代码,删除给定的值之后,得到一个新的有序列表,长度-1,下面是具体的实现方法...2021-08-22
- 这篇文章主要介绍了PHP简单实现生成txt文件到指定目录的方法,简单对比分析了PHP中fwrite及file_put_contents等函数的使用方法,需要的朋友可以参考下...2016-04-28
- 这篇文章主要介绍了php判断邮箱地址是否存在的方法,php判断邮箱地址是否存在的方法有两种,感兴趣的朋友可以参考一下...2016-02-18
- 这篇文章主要为大家详细介绍了php图片添加文字水印实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2016-03-17