【ML+】文章管理多图上传修改功能 uploadify的成品

浏览:1185 发布日期:2017/05/10 分类:功能实现
thinkphp3.2.3+uploadify 多图上传,添加,删除,修改
独立多图上传模块,可以进群文件下载整套程序,然后自己去分离,我就不帖出来了:QQ群:457295993


<div class="form-group">
<label class="col-sm-2 control-label">多图图片上传</label>
<div class="col-sm-10">
<input type="file" name="file_upload" id="file_upload" />
<input type="hidden" name="url_arr" id="url_arr">
<div id="image" ></div>
</div>
</div>
<div class="hr-line-dashed"></div>
<script type="text/javascript">
var img_id_upload=new Array();//初始化数组,存储已经上传的图片名
var i=0;//初始化数组下标
$(function() {
$("#file_upload").uploadify({
"height" : 30,
"swf" : "__PUBLIC__/uploadify/uploadify.swf",
"fileObjName" : "download",
"buttonText" : "上传图片",
"method" : "post",//方法,服务端可以用$_POST数组获取数据
"uploader" : "{:U('file/uploadPicture',array('session_id'=>session_id()))}",
"width" : 120,
'removeTimeout' : 1,
'fileTypeExts' : '*.jpg; *.png; *.gif;',
"onUploadSuccess" : uploadPicture
});
//可以根据自己的要求来做相应处理
function uploadPicture(file, data){
var data = $.parseJSON(data);

if(data.status){

var str=$('#image').html();
var add="<div class=r_pic id=pic"+data.id+"><input type=hidden id=text"+data.id+" value="+data.url+"><img src='__PUBLIC__"+data.url+"'/></img><a class='close-pop' href='javascript:;' onclick=colise('"+data.id+"');></a></div>";
str+=add;

var url_arr=$('#url_arr').val();
var url_find=data.url;
url_arr+=url_find+',';

$('#url_arr').val(url_arr);

$('#image').html(str);
return true;
} else {
// alert(data.url);
}
}
});

function colise(id){
$('#pic'+id).hide();
var pic_find=$('#text'+id).val();
var pic_arr=$('#url_arr').val();
str=pic_arr.replace(pic_find+",","");
$('#url_arr').val(str);
}

</script>

评论( 相关
后面还有条评论,点击查看>>