纯js仿淘宝多图片封面图插件模板/带视频,带放大镜,带前后端完整代码PHP

在这里插入图片描述

功能预览,他依赖jq插件,请自已引入
类似这样

<script type="text/javascript" src="/Application/Admin/Static/js/jquery-2.0.3.min.js"></script>

一,前端模板代码

	<!--多图功能--><style>
@charset "utf-8";
.wrap_imgs img {vertical-align: middle;width: 100%;height: 100%;
}
.wrap_imgs {position: relative;top: 0px;left: 0px;width: 100%;height:auto;min-height: 410px;
}
.imgss {position: absolute;left: 0;top: 0;width: 100%;height: 100%;
}
.wrap_mains {position: relative;overflow: hidden;width: 100%;height: 330px;
}
.smallers {position: relative;overflow: hidden;width: 100%;height: 82px;margin-top: 10px;
}
.smallers li ,.smallers span {position: relative;float: left;padding: 2px;width: 86px;height: 64px;border: 1px solid #ccc;margin: 0 5px;cursor: pointer;display:block;}
.smallers li:first-child {margin-left: 0;
}
.smallers .current {border: 1px dashed #ec6941;
}
.bigers {position: absolute;overflow: hidden;display: none;left: 490px;width: 470px;height: 350px;
}
.masks {position: absolute;display: none;left: 0;top: 0;width: 100px;height: 100px;background: url('./Public/home/images/mask-bg.png') repeat;cursor: crosshair;
}
.bigers img {position: absolute;left: 0;top: 0;z-index:100;width: 200%;height: 200%;
}@media (max-width: 1439px) {
.smallers li ,.smallers span {width: 53px;height: 50px;
margin: 0 3px;
padding: 1px;
}
.wrap_mains {position: relative;overflow: hidden;width: 100%;height: 286px;
}
.bigers {
left: 450px;width: 470px;height: 300px;
}
.wrap_imgs {width: 100%;height:auto;min-height: 350px;
}
}@media (max-width: 768px) {
.smallers li ,.smallers span {width: 56px;height: 50px;
margin: 0 3px;
padding: 1px;
}}
</style>
<div class="wrap_imgs"><div class="bigers" id="bigers"></div><div class="imgss"><div class="wrap_mains" id="wrap_mains"><notempty name="videob" >{$videob}</notempty><div class="masks" id="masks"></div></div><ul class="smallers" id="smallers"><notempty name="videos" ><span id="smallvideo">{$videos}</span></notempty></ul></div>
</div><script>function morepics(){
var bigvideo=document.getElementById('bigvideo');
var smallvideo=document.getElementById('smallvideo');var bigers=document.getElementById('bigers');//最终2倍放大的图var wrap_mains=document.getElementById('wrap_mains');var wrap_mains_Child=wrap_mains.getElementsByTagName('img');var smallers=document.getElementById('smallers');var masks=document.getElementById('masks');var wrap_imgs=bigers.parentNode;var imgArr=[{$tuku}];var imgSum=imgArr.length;if(imgSum>4){imgSum=4;}//追加小图片列表for (var i=0;i<imgSum;i++) {var lis=document.createElement('li');var imgs=document.createElement('img');imgs.src=imgArr[i].path;lis.appendChild(imgs);smallers.appendChild(lis);}var wrap_mainsImg=document.createElement('img');//准备被放大的大图var bigImg=document.createElement('img');//如果视频存在if(bigvideo){bigers.appendChild(bigImg);//先加载一个放大的2倍图var bigPic=bigers.children[0];var liArr=smallers.getElementsByTagName('li');bigImg.src=liArr[0].children[0].src;wrap_mainsImg.src=liArr[0].children[0].src;//初始化时wrap_mainsImg.style.display='none';wrap_mains.insertBefore(wrap_mainsImg,masks);//alert(liArr.length);smallvideo.className='current';smallvideo.onmouseover=function(){this.className='current';bigvideo.style.display='block';//视频显示.wrap_mainsImg.style.display='none';//大图片隐藏for (var j = 0; j < liArr.length; j++) {liArr[j].removeAttribute('class');liArr[j].removeAttribute('className');}}for (var i=0;i<liArr.length;i++) {liArr[i].index=i;liArr[i].onmouseover=function(){this.className='current';smallvideo.removeAttribute('class');smallvideo.removeAttribute('className');bigPic.src=this.children[0].src;wrap_mains.children[1].src=this.children[0].src;bigvideo.style.display='none';//视频隐藏wrap_mainsImg.style.display='block';for (var j = 0; j < liArr.length; j++) {if(this!=liArr[j]){liArr[j].removeAttribute('class');liArr[j].removeAttribute('className');}}}}wrap_mains.onmouseenter=function(){if( smallvideo.className!='current'){masks.style.display='block';bigers.style.display='block';//alert(smallvideo.className);}}wrap_mains.onmouseleave=function(){masks.style.display='none';bigers.style.display='none';}wrap_mains.onmousemove=function(e){if( smallvideo.className!='current'){var e = e || window.event;var pagex=e.pageX || scrolls().left+e.clientX;var pagey=e.pageY || scrolls().top+e.clientY;pagex=pagex-wrap_imgs.offsetLeft-masks.offsetWidth/2;;pagey=pagey-wrap_imgs.offsetTop-masks.offsetHeight/2;if(pagex<0){pagex=0;}if(pagey<0){pagey=0;}if(pagex>wrap_mains.offsetWidth-masks.offsetWidth){pagex=wrap_mains.offsetWidth-masks.offsetWidth;}if(pagey>wrap_mains.offsetHeight-masks.offsetHeight){pagey=wrap_mains.offsetHeight-masks.offsetHeight;}masks.style.left=pagex+'px';masks.style.top=pagey+'px';var scale=(bigPic.offsetWidth-bigers.offsetWidth)/(wrap_mains.offsetWidth-masks.offsetWidth);var xx=pagex*scale;var yy=pagey*scale;bigPic.style.left=-xx+'px';bigPic.style.top=-yy+'px';}}}else{var liArr=smallers.children;bigImg.src=wrap_mainsImg.src=liArr[0].children[0].src;wrap_mains.insertBefore(wrap_mainsImg,masks);bigers.appendChild(bigImg);var bigPic=bigers.children[0];liArr[0].className='current';for (var i=0;i<liArr.length;i++) {liArr[i].index=i;liArr[i].onmouseover=function(){this.className='current';bigPic.src=wrap_mains.children[0].src=this.children[0].src;for (var j = 0; j < liArr.length; j++) {if(this!=liArr[j]){liArr[j].removeAttribute('class');liArr[j].removeAttribute('className');}}}}wrap_mains.onmouseenter=function(){masks.style.display='block';bigers.style.display='block';}wrap_mains.onmouseleave=function(){masks.style.display='none';bigers.style.display='none';}wrap_mains.onmousemove=function(e){var e = e || window.event;var pagex=e.pageX || scrolls().left+e.clientX;var pagey=e.pageY || scrolls().top+e.clientY;pagex=pagex-wrap_imgs.offsetLeft-masks.offsetWidth/2;;pagey=pagey-wrap_imgs.offsetTop-masks.offsetHeight/2;if(pagex<0){pagex=0;}if(pagey<0){pagey=0;}if(pagex>wrap_mains.offsetWidth-masks.offsetWidth){pagex=wrap_mains.offsetWidth-masks.offsetWidth;}if(pagey>wrap_mains.offsetHeight-masks.offsetHeight){pagey=wrap_mains.offsetHeight-masks.offsetHeight;}masks.style.left=pagex+'px';masks.style.top=pagey+'px';var scale=(bigPic.offsetWidth-bigers.offsetWidth)/(wrap_mains.offsetWidth-masks.offsetWidth);var xx=pagex*scale;var yy=pagey*scale;bigPic.style.left=-xx+'px';bigPic.style.top=-yy+'px';}}}
</script>

二,前端控制器代码

$video=M('video')->where('cpinfo_id=1 and catid='.$id)->order('ctime desc')->find();	if($video){$vvb='<video id="bigvideo" class="edui-upload-video  vjs-default-skin video-js" controls="" preload="none" width="100%" height="auto" style="min-height:350px" poster="" src="'.$video['url'].'" data-setup="{}"><source src="'.$video['url'].'" type="video/wav"></video>'; $vvs='<img  src="./Uploads/shipin_fengmian.jpg"/>'; }$this->assign('videob',$vvb); $this->assign('videos',$vvs); $tuku=M('tuku')->where('cpinfo_id=0 and catid='.$id)->order('orderby asc')->select();	$tus='';foreach($tuku as $v){$tus.='{"path":"'.$v['pic'].'"},';}$tus = substr($tus, 0, -1);$this->assign('tuku',$tus);

三.数据库sql

CREATE TABLE `tg_video` (`id` int(11) NOT NULL,`cpinfo_id` int(11) DEFAULT '0',`title` varchar(100) DEFAULT NULL,`ctime` int(11) DEFAULT '0',`pic` varchar(300) DEFAULT NULL,`catid` int(11) NOT NULL DEFAULT '0' COMMENT '附件所属产品的分类',`url` varchar(300) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=utf8;ALTER TABLE `tg_video`ADD PRIMARY KEY (`id`);ALTER TABLE `tg_video`MODIFY `id` int(11) NOT NULL AUTO_INCREMENT;
COMMIT;
CREATE TABLE `tg_tuku` (`id` int(11) NOT NULL,`cpinfo_id` int(11) DEFAULT '0' COMMENT '0表示型号id未定,当catid大于0,cpinfo_id=0表示是分类专用图片.1表示添加分类时(catid=0),2表示添加产品时上传',`title` varchar(100) DEFAULT NULL,`ctime` int(11) DEFAULT '0',`pic` varchar(300) DEFAULT NULL,`catid` int(11) NOT NULL DEFAULT '0' COMMENT '附件所属产品的分类',`orderby` int(11) NOT NULL DEFAULT '0' COMMENT '排序',`retype` int(11) NOT NULL DEFAULT '0' COMMENT '图片所属分类的上级分类'
) ENGINE=MyISAM DEFAULT CHARSET=utf8;
ALTER TABLE `tg_tuku`ADD PRIMARY KEY (`id`);
ALTER TABLE `tg_tuku`MODIFY `id` int(11) NOT NULL AUTO_INCREMENT;
COMMIT;

四,后台控制器

//单列内容列表function insert_alltuku(){$catid=(int)I('catid');$pic=I('pic');//$pic='./Uploads/tuku/2023-11-07_10-53-01_929.jpg';$o=M('tuku')->where("pic='".$pic."'")->find();//  print_r($o);exit;$arrr=array();
if	($o){if($catid){$o2=M('conttype')->where('id='.$catid)->find();$arrr['retype']=$o2['retype'];}$arrr['pic']=$pic;$arrr['catid']=$catid;$arrr['title']=$o['title'];$arrr['ctime']=time();$arrr['cpinfo_id']=($catid==0)?1:0;
}			$id=M('tuku')->add($arrr);		if($id){M('tuku')->where('id='.$id)->setField('orderby',$id);echo json_encode(array('pic'=>$_POST['pic'],'id'=>$id));
}else{echo 0;
}}
function insert_alltuku_clist(){$cpinfo_id=(int)I('cpinfo_id');$catid=(int)I('catid');$pic=I('pic');//$pic='./Uploads/tuku/2023-11-07_10-53-01_929.jpg';$o=M('tuku')->where("pic='".$pic."'")->find();//  print_r($o);exit;$arrr=array();
if	($o){if($catid){$o2=M('conttype')->where('id='.$catid)->find();$arrr['retype']=$o2['retype'];}$arrr['pic']=$pic;$arrr['catid']=$catid;$arrr['title']=$o['title'];$arrr['ctime']=time();$arrr['cpinfo_id']=($cpinfo_id==0)?2:$cpinfo_id;
}			$id=M('tuku')->add($arrr);		if($id){M('tuku')->where('id='.$id)->setField('orderby',$id);echo json_encode(array('pic'=>$_POST['pic'],'id'=>$id));
}else{echo 0;
}}
function uploadifive(){
$catid=I('catid');
if($catid>0){//分类编辑$count=M('tuku')->where('(cpinfo_id=0) and catid='.$catid)->count();
}else{ //分类添加$_POST['cpinfo_id']=1;$count=M('tuku')->where('cpinfo_id=1 and catid=0')->count();//  print_r($count);exit;
}if($count>3) {echo 0;exit;}//  echo '<script>alert('.$count.');</script>';$uploadDir = '/Uploads/tuku/';
// Set the allowed file extensions
$fileTypes = array( 'png','jpg','jpeg','png','gif','webp'); // Allowed file extensionsif (!empty($_FILES) ) {$tempFile   = $_FILES['Filedata']['tmp_name'];$uploadDir  = $_SERVER['DOCUMENT_ROOT'] . $uploadDir;//$targetFile = $uploadDir . $_FILES['Filedata']['name'];
//后缀$lx=strrchr($_FILES['Filedata']['name'],".");// Validate the filetype$fileParts = pathinfo($_FILES['Filedata']['name']);if (in_array(strtolower($fileParts['extension']), $fileTypes)) {// Save the file//  $lx=strrchr($tempFile,".");$newtime=date('Y-m-d_H-i-s').'_';$rund= rand(0,999);$_POST['pic']='./Uploads/tuku/'.$newtime.$rund.$lx; $copy=move_uploaded_file($tempFile, $_POST['pic']);if($copy){//版本号//$bbh=basename($_FILES['Filedata']['name'],$lx);//	;//	M('user_exe')->where('id='.I('id'))->setField('new_v',$bbh);;$_POST['ctime']=time();//$_POST['orderby']=time();//$_POST['cpinfo_id']=0;//0表示产品型号id未定,产品保存后,修改成实际的,分类编辑后,重新设置为1.表示图片是分类专用的图片$id2=M('tuku')->add($_POST);if($id2){M('tuku')->where('id='.$id2)->setField('orderby',$id2);if($catid){$o=M('conttype')->where('id='.$catid)->find();M('tuku')->where('id='.$id2)->setField('retype',$o['retype']);}
}//	header("Location: ?a=user_exe");//header("Location: ?a=user_exe");echo json_encode(array('pic'=>$_POST['pic'],'id'=>$id2));
}} else {// The file type wasn't allowedecho '文件类型禁止上传.';}
}	}//视频上传
function uploadifive_v(){
$catid=I('catid');
$cpinfo_id=I('cpinfo_id');$is_catid=I('is_catid');if($is_catid){//如果是分类页$_POST['cpinfo_id']=1;}else{//产品页上传视频时$_POST['cpinfo_id']=$cpinfo_id==0?2:$cpinfo_id;//产品号为0时,表示在添加产品,}//  echo '<script>alert('.$count.');</script>';$uploadDir = '/Uploads/video/';
// Set the allowed file extensions
$fileTypes = array( 'mp4','3gp','avi','rm','wav','acc'); // Allowed file extensionsif (!empty($_FILES) ) {$tempFile   = $_FILES['Filedata']['tmp_name'];$uploadDir  = $_SERVER['DOCUMENT_ROOT'] . $uploadDir;//$targetFile = $uploadDir . $_FILES['Filedata']['name'];
//后缀$lx=strrchr($_FILES['Filedata']['name'],".");// Validate the filetype$fileParts = pathinfo($_FILES['Filedata']['name']);if (in_array(strtolower($fileParts['extension']), $fileTypes)) {// Save the file$newtime=date('Y-m-d-His').'_';$rund= rand(0,9999);$_POST['url']='./Uploads/video/'.$newtime.$rund.$lx; $copy=move_uploaded_file($tempFile, $_POST['url']);if($copy){$_POST['ctime']=time();$id2=M('video')->add($_POST);if($id2){//M('video')->where('id='.$id2)->setField('orderby',$id2);//查询有重复视频,则删除
//echo ($catid);exit;//如果本分类存在其它视频.则判断是否是共用的if($is_catid){$cont=M('video')->where("id != $id2 and cpinfo_id=1 and catid =".$catid)->select();//cpinfo_id=0表示是分类专属图片.//echo json_encode($cont);exit;if($cont){foreach($cont as $v){$id3=$v['id'];$del=M('video')->where(" id=$id3 ")->delete();}}}else{$cont=M('video')->where("id != ".$id2 . " and ( cpinfo_id= 2 or cpinfo_id=".$cpinfo_id." ) " )->select();if($cont){foreach($cont as $v){$id3=$v['id'];$del=M('video')->where(" id=$id3 ")->delete();}}}echo  $_POST['url'];
}//	header("Location: ?a=user_exe");//header("Location: ?a=user_exe");}} else {// The file type wasn't allowedecho '文件类型禁止上传.';}
}	}//取消选择已存在的图function del_tuku(){$id = $_POST['id'];$url = $_POST['url'];//$v['ctime']+259200)<time()$del=M('tuku')->where("id=".$id)->delete();$o3=M('tuku')->where("pic='".$url."'")->count();if($o3==0){$del=M('tuku')->where("id=".$id)->delete();		unlink($_SERVER['DOCUMENT_ROOT'].$url); }if($del){echo 1;}else{echo 0;}}function get_tuku_clist(){$id=(int)I('id')>2?(int)I('id'):2;$cont=M('tuku')->where("cpinfo_id=$id ")->order('ctime desc')->select();
if($cont){echo  json_encode($cont);;
}else{echo 0;
}}function get_tuku(){$catid=(int)I('typeid');//$catid=579;$cont=M('tuku')->where("cpinfo_id=0 and catid =".$catid)->order('ctime desc')->select();
if($cont){echo  json_encode($cont);;
}else{echo 0;
}}function change_order_tuku(){$id=I('ids');$order=I('order');$cont=M('tuku')->where("id =".$id)->setField('orderby',$order);
if($cont){echo 1;
}else{echo 0;
}}function change_title_tuku(){$id=I('ids');$title=I('title');$cont=M('tuku')->where("id =".$id)->setField('title',$title);
if($cont){echo 1;
}else{echo 0;
}}

五,后台模板


<style>
/*
UploadiFive
Copyright (c) 2012 Reactive Apps, Ronnie Garcia
*/.uploadifive-button {background-color: #505050;background-image: linear-gradient(bottom, #505050 0%, #707070 100%);background-image: -o-linear-gradient(bottom, #505050 0%, #707070 100%);background-image: -moz-linear-gradient(bottom, #505050 0%, #707070 100%);background-image: -webkit-linear-gradient(bottom, #505050 0%, #707070 100%);background-image: -ms-linear-gradient(bottom, #505050 0%, #707070 100%);background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #505050),color-stop(1, #707070));background-position: center top;background-repeat: no-repeat;-webkit-border-radius: 30px;-moz-border-radius: 30px;border-radius: 30px;border: 2px solid #808080;color: #FFF;font: bold 12px Arial, Helvetica, sans-serif;text-align: center;text-shadow: 0 -1px 0 rgba(0,0,0,0.25);text-transform: uppercase;width: 100%;
}
.uploadifive-button:hover {background-color: #606060;background-image: linear-gradient(top, #606060 0%, #808080 100%);background-image: -o-linear-gradient(top, #606060 0%, #808080 100%);background-image: -moz-linear-gradient(top, #606060 0%, #808080 100%);background-image: -webkit-linear-gradient(top, #606060 0%, #808080 100%);background-image: -ms-linear-gradient(top, #606060 0%, #808080 100%);background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #606060),color-stop(1, #808080));background-position: center bottom;
}
.uploadifive-queue-item {background-color: #F5F5F5;border-bottom: 1px dotted #D5D5D5;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;font: 12px Arial, Helvetica, Sans-serif;margin-top: 3px;padding: 5px;
}
.uploadifive-queue-item .close {background: url('uploadifive-cancel.png') 0 0 no-repeat;display: block;float: right;height: 16px;text-indent: -9999px;width: 16px;
}
.uploadifive-queue-item .progress {border: 1px solid #D0D0D0;height: 3px;margin-top: 5px;width: 100%;
}
.uploadifive-queue-item .progress-bar {background-color: #0072BC;height: 3px;width: 0;
}
</style><div class="form-item cf  col-sm-6">
<div id="fileQueue_v"></div><input  id="file_upload_v" name="file_upload_v" type="file" multiple="true"/>可直接填写以前上传过的视频,地址格式需要以 ./Uploads/video/开头<div class="clearfix"></div><br/><input  id="video" name="video" value="{$video.url}"placeholder="视频地址"class="text input-large form-control form-input-width" type="text" style="width:96%"/>请预览,以查看视频是否正确 </div><div class="form-item cf  col-sm-4"><video id="video_see" class="edui-upload-video  vjs-default-skin video-js" controls="" preload="none" width="100%" height="120" poster="" src="{$video.url}" data-setup="{}"><source id="video_source" src="{$video.url}" type="video/mp4"/></video></div></div><div class="form-item cf  col-sm-7"><label class="item-label">产品多图,最多4张：排序号最小的默认设置为封面图,如果有多余图片,说明图片不属于任何分类,可直接删除<br/></font></label><div id="fileQueue"></div><div class="col-sm-2"><div style="padding:5px;text-align:center;"><input id="file_upload"type="file"name="Filedata"/><div class="clearfix"></div>	<img style="border:1px solid #ccc;margin-top:5px" src="{$cont.pic2}" width="100%" height="auto"/> <div class="clearfix"></div>原封面图<p onclick="alltuku();"style="display:inline-block;border-radius: 16px;height: 32px; line-height: 32px; overflow: hidden; position: relative; text-align: center; font-size:12px;color:#fff;width: 140px;background: #ec6941;">选择上传过的图片</p>  </div>
<input type="hidden" id='hiddenclick' value=''/></div><div class="col-sm-2"><input id="inputorder1" type="text" onblur="change_order(1)" style="width:100%;"placeholder="排序编号 小的在前"/><div style="height:4px"> </div><p style="position: relative;border:1px solid #ccc;"><img id="tuku1" src="__PUBLIC__/admin/images/nopic.png" width="100%" height="100"/><p id="del_tuku1"style="background:#fff;display:none;color:red;position: absolute;right:10px;top:25px;border:1px solid red;padding:0 5px;"title="删除"onclick="del_tuku(1);">X</p></p><input id="inputtuku1" type="hidden" name="tuku1"/><textarea id="title1"placeholder="标题"onblur="change_title(1)" type="text" name="title1"class="" style="width:100%;"></textarea><br/></div><div class="col-sm-2"><input id="inputorder2" type="text" onblur="change_order(2)" style="width:100%;"placeholder="排序编号 小的在前"/><div style="height:4px"> </div><p style="position: relative;border:1px solid #ccc;"><img id="tuku2" src="__PUBLIC__/admin/images/nopic.png" width="100%" height="100"/><p id="del_tuku2"style="background:#fff;display:none;color:red;position: absolute;right:10px;top:25px;border:1px solid red;padding:0 5px;"title="删除"onclick="del_tuku(2);">X</p></p><input id="inputtuku2" type="hidden" name="tuku2"/><textarea id="title2"placeholder="标题"onblur="change_title(2)" type="text" name="title2"class="" style="width:100%;"></textarea><br/></div><div class="col-sm-2"><input id="inputorder3" type="text" onblur="change_order(3)" style="width:100%;"placeholder="排序编号 小的在前"/><div style="height:4px"> </div><p style="position: relative;border:1px solid #ccc;"><img id="tuku3" src="__PUBLIC__/admin/images/nopic.png" width="100%" height="100"/><p id="del_tuku3"style="background:#fff;display:none;color:red;position: absolute;right:10px;top:25px;border:1px solid red;padding:0 5px;"title="删除"onclick="del_tuku(3);">X</p></p><input id="inputtuku3" type="hidden" name="tuku3"/><textarea id="title3"placeholder="标题"onblur="change_title(3)" type="text" name="title3"class="" style="width:100%;"></textarea><br/></div><div class="col-sm-2"><input id="inputorder4" type="text" onblur="change_order(4)" style="width:100%;"placeholder="排序编号 小的在前"/><div style="height:4px"> </div><p style="position: relative;border:1px solid #ccc;"><img id="tuku4" src="__PUBLIC__/admin/images/nopic.png" width="100%" height="100"/><p id="del_tuku4"style="background:#fff;display:none;color:red;position: absolute;right:10px;top:25px;border:1px solid red;padding:0 5px;"title="删除"onclick="del_tuku(4);">X</p></p><input id="inputtuku4" type="hidden" name="tuku4"/><textarea id="title4"placeholder="标题"onblur="change_title(4)" type="text" name="title4"class="" style="width:100%;"></textarea><br/></div><!--其它相关图片--><div class="clearfix"></div><div id="other_tuku"style=".margin-top:10px;2border:1px solid #ccc;1overflow:hidden;display:none"><volist name="alltuku" id="v"><div class="col-sm-1"><a><img style="border:1px solid #ccc;"id="ins"onclick="insert_alltuku('{$v.pic}');" title="{$v.title}" src="{$v.pic}"/></a></div></volist></div><script type="text/javascript">/*
UploadiFive 1.2.3 上传插件
Copyright (c) 2012 Reactive Apps, Ronnie Garcia
Released under the MIT License
*/
;(function($) {var methods = {init : function(options) {return this.each(function() {// Create a reference to the jQuery DOM objectvar $this = $(this);$this.data('uploadifive', {inputs     : {}, // The object that contains all the file inputsinputCount : 0,  // The total number of file inputs createdfileID     : 0,queue      : {count      : 0, // Total number of files in the queueselected   : 0, // Number of files selected in the last select operationreplaced   : 0, // Number of files replaced in the last select operationerrors     : 0, // Number of files that returned an error in the last select operationqueued     : 0, // Number of files added to the queue in the last select operationcancelled  : 0  // Total number of files that have been cancelled or removed from the queue},uploads    : {current    : 0, // Number of files currently being uploadedattempts   : 0, // Number of file uploads attempted in the last upload operationsuccessful : 0, // Number of files successfully uploaded in the last upload operationerrors     : 0, // Number of files returning errors in the last upload operationcount      : 0  // Total number of files uploaded successfully}});var $data = $this.data('uploadifive');// Set the default optionsvar settings = $data.settings = $.extend({'auto'            : true,               // Automatically upload a file when it's added to the queue'buttonClass'     : false,              // A class to add to the UploadiFive button'buttonText'      : '批量上传图片',     // The text that appears on the UploadiFive button'checkScript'     : false,              // Path to the script that checks for existing file names 'dnd'             : true,               // Allow drag and drop into the queue'dropTarget'      : false,              // Selector for the drop target'fileObjName'     : 'Filedata',         // The name of the file object to use in your server-side script'fileSizeLimit'   : 0,                  // Maximum allowed size of files to upload'fileType'        : false,              // Extension of files allowed (.zip,.rar,.7z,.pdf,...ETC.), separate with a comma character ,'formData'        : {},                 // Additional data to send to the upload script'height'          : 35,                 // The height of the button'itemTemplate'    : false,              // The HTML markup for the item in the queue'method'          : 'post',             // The method to use when submitting the upload'multi'           : true,               // Set to true to allow multiple file selections'overrideEvents'  : [],                 // An array of events to override'queueID'         : false,              // The ID of the file queue'queueSizeLimit'  : 0,                  // The maximum number of files that can be in the queue'removeCompleted' : true,              // Set to true to remove files that have completed uploading'simUploadLimit'  : 0,                  // The maximum number of files to upload at once'truncateLength'  : 0,                  // The length to truncate the file names to'uploadLimit'     : 0,                  // The maximum number of files you can upload'uploadScript'    : 'uploadifive.php',  // The path to the upload script'width'           : 120                 // The width of the button/*// Events'onAddQueueItem'   : function(file) {},                        // Triggered for each file that is added to the queue'onCancel'         : function(file) {},                        // Triggered when a file is cancelled or removed from the queue'onCheck'          : function(file, exists) {},                // Triggered when the server is checked for an existing file'onClearQueue'     : function(queue) {},                       // Triggered during the clearQueue function'onDestroy'        : function() {}                             // Triggered during the destroy function'onDrop'           : function(files, numberOfFilesDropped) {}, // Triggered when files are dropped into the file queue'onError'          : function(file, fileType, data) {},        // Triggered when an error occurs'onFallback'       : function() {},                            // Triggered if the HTML5 File API is not supported by the browser'onInit'           : function() {},                            // Triggered when UploadiFive if initialized'onQueueComplete'  : function() {},                            // Triggered once when an upload queue is done'onProgress'       : function(file, event) {},                 // Triggered during each progress update of an upload'onSelect'         : function() {},                            // Triggered once when files are selected from a dialog box'onUpload'         : function(file) {},                        // Triggered when an upload queue is started'onUploadComplete' : function(file, data) {},                  // Triggered when a file is successfully uploaded'onUploadFile'     : function(file) {},                        // Triggered for each file being uploaded*/}, options);// Create an array of file typesvar file_types;if (settings.fileType) {file_types = settings.fileType.split(',');}// Calculate the file size limitif (isNaN(settings.fileSizeLimit)) {var fileSizeLimitBytes = parseInt(settings.fileSizeLimit) * 1.024;if (settings.fileSizeLimit.indexOf('KB') > -1) {settings.fileSizeLimit = fileSizeLimitBytes * 1000;} else if (settings.fileSizeLimit.indexOf('MB') > -1) {settings.fileSizeLimit = fileSizeLimitBytes * 1000000;} else if (settings.fileSizeLimit.indexOf('GB') > -1) {settings.fileSizeLimit = fileSizeLimitBytes * 1000000000;}} else {settings.fileSizeLimit = settings.fileSizeLimit * 1024;}// Create a template for a file input$data.inputTemplate = $('<input type="file">').css({'font-size' : settings.height + 'px','opacity'   : 0,'position'  : 'absolute','right'     : '-3px','top'       : '-3px','z-index'   : 999 });// Create a new input$data.createInput = function() {// Create a clone of the file inputvar input     = $data.inputTemplate.clone();// Create a unique name for the input itemvar inputName = input.name = 'input' + $data.inputCount++;// Set the multiple attributeif (settings.multi) {input.attr('multiple', true);}// Set the accept attribute on the inputif (settings.fileType) {input.attr('accept', settings.fileType);}// Set the onchange event for the inputinput.bind('change', function() {$data.queue.selected = 0;$data.queue.replaced = 0;$data.queue.errors   = 0;$data.queue.queued   = 0;// Add a queue item to the queue for each filevar limit = this.files.length;$data.queue.selected = limit;//表示多选文件数//alert(limit );if (($data.queue.count + limit) > settings.queueSizeLimit //&& settings.queueSizeLimit !== 0) {if ($.inArray('onError', settings.overrideEvents) < 0) {alert('目前的上传数量不得超过 ' + settings.queueSizeLimit + '. ');}// Trigger the error eventif (typeof settings.onError === 'function') {settings.onError.call($this, 'QUEUE_LIMIT_EXCEEDED');}} else {for (var n = 0; n < limit; n++) {file = this.files[n];$data.addQueueItem(file);}$data.inputs[inputName] = this;$data.createInput();}// Upload the file if auto-uploads are enabledif (settings.auto) {methods.upload.call($this);}// Trigger the select eventif (typeof settings.onSelect === 'function') {settings.onSelect.call($this, $data.queue);}});// Hide the existing current item and add the new oneif ($data.currentInput) {$data.currentInput.hide();}$data.button.append(input);$data.currentInput = input;};// Remove an input$data.destroyInput = function(key) {$($data.inputs[key]).remove();delete $data.inputs[key];$data.inputCount--;};// Drop a file into the queue$data.drop = function(e) {// Stop FireFox from opening the dropped file(s)e.preventDefault();e.stopPropagation();$data.queue.selected = 0;$data.queue.replaced = 0;$data.queue.errors   = 0;$data.queue.queued   = 0;var fileData = e.dataTransfer;var inputName = fileData.name = 'input' + $data.inputCount++;// Add a queue item to the queue for each filevar limit = fileData.files.length;alert(limit );$data.queue.selected = limit;if (($data.queue.count + limit) > settings.queueSizeLimit//Loop through the files&& settings.queueSizeLimit !== 0) {// Check if the queueSizeLimit was reachedif ($.inArray('onError', settings.overrideEvents) < 0) {alert('The maximum number of queue items has been reached (' + settings.queueSizeLimit + ').  Please select fewer files.');}// Trigger the onError eventif (typeof settings.onError === 'function') {settings.onError.call($this, 'QUEUE_LIMIT_EXCEEDED');}} else {// Add a queue item for each filefor (var n = 0; n < limit; n++) {file = fileData.files[n];$data.addQueueItem(file);// Check the filetypeif (file_types) {if(file_types.indexOf(file.name.substring(file.name.lastIndexOf('.')))<0)$data.error('FORBIDDEN_FILE_TYPE', file);}}// Save the data to the inputs object$data.inputs[inputName] = fileData;}// Upload the file if auto-uploads are enabledif (settings.auto) {methods.upload.call($this);}// Trigger the onDrop eventif (typeof settings.onDrop === 'function') {settings.onDrop.call($this, fileData.files, fileData.files.length);}};// Check if a filename exists in the queue$data.fileExistsInQueue = function(file) {for (var key in $data.inputs) {input = $data.inputs[key];limit = input.files.length;for (var n = 0; n < limit; n++) {existingFile = input.files[n];// Check if the filename matchesif (existingFile.name == file.name && !existingFile.complete) {return true;}}}return false;};// Remove an existing file in the queue$data.removeExistingFile = function(file) {for (var key in $data.inputs) {input = $data.inputs[key];limit = input.files.length;for (var n = 0; n < limit; n++) {existingFile = input.files[n];// Check if the filename matchesif (existingFile.name == file.name && !existingFile.complete) {$data.queue.replaced++;methods.cancel.call($this, existingFile, true);}}}};// Create the file item templateif (settings.itemTemplate === false) {$data.queueItem = $('<div class="uploadifive-queue-item">' +'<a class="close" href="#">X</a>' +'<div><span class="filename"></span><span class="fileinfo"></span></div>' +'<div class="progress">' +'<div class="progress-bar"></div>' +'</div>' +'</div>');} else {$data.queueItem = $(settings.itemTemplate);}// Add an item to the queue$data.addQueueItem = function(file) {if ($.inArray('onAddQueueItem', settings.overrideEvents) < 0) {// Check if the filename already exists in the queue$data.removeExistingFile(file);// Create a clone of the queue item templatefile.queueItem = $data.queueItem.clone();// Add an ID to the queue itemfile.queueItem.attr('id', settings.id + '-file-' + $data.fileID++);// Bind the close event to the close buttonfile.queueItem.find('.close').bind('click', function() {methods.cancel.call($this, file);return false;});var fileName = file.name;if (fileName.length > settings.truncateLength && settings.truncateLength !== 0) {fileName = fileName.substring(0, settings.truncateLength) + '...';}file.queueItem.find('.filename').html(fileName);// Add a reference to the filefile.queueItem.data('file', file);$data.queueEl.append(file.queueItem);}// Trigger the addQueueItem eventif (typeof settings.onAddQueueItem === 'function') {settings.onAddQueueItem.call($this, file);}// Check the filetypeif (file_types) {if(file_types.indexOf(file.name.substring(file.name.lastIndexOf('.')))<0)$data.error('FORBIDDEN_FILE_TYPE', file);}// Check the filesizeif (file.size > settings.fileSizeLimit && settings.fileSizeLimit !== 0) {$data.error('FILE_SIZE_LIMIT_EXCEEDED', file);} else {$data.queue.queued++;$data.queue.count++;}};// Remove an item from the queue$data.removeQueueItem = function(file, instant, delay) {// Set the default delayif (!delay) delay = 0;var fadeTime = instant ? 0 : 500;if (file.queueItem) {if (file.queueItem.find('.fileinfo').html() != ' - Completed') {file.queueItem.find('.fileinfo').html(' - Cancelled');}file.queueItem.find('.progress-bar').width(0);file.queueItem.delay(delay).fadeOut(fadeTime, function() {$(this).remove();});delete file.queueItem;$data.queue.count--;}};// Count the number of files that need to be uploaded$data.filesToUpload = function() {var filesToUpload = 0;for (var key in $data.inputs) {input = $data.inputs[key];limit = input.files.length;for (var n = 0; n < limit; n++) {file = input.files[n];if (!file.skip && !file.complete) {filesToUpload++;}}}return filesToUpload;};// Check if a file exists$data.checkExists = function(file) {if ($.inArray('onCheck', settings.overrideEvents) < 0) {// This request needs to be synchronous$.ajaxSetup({'async' : false});// Send the filename to the check scriptvar checkData = $.extend(settings.formData, {filename: file.name});$.post(settings.checkScript, checkData, function(fileExists) {file.exists = parseInt(fileExists);});if (file.exists) {if (!confirm('A file named ' + file.name + ' already exists in the upload folder.\nWould you like to replace it?')) {// If not replacing the file, cancel the uploadmethods.cancel.call($this, file);return true;}}}// Trigger the check eventif (typeof settings.onCheck === 'function') {settings.onCheck.call($this, file, file.exists);}return false;};// Upload a single file$data.uploadFile = function(file, uploadAll) {if (!file.skip && !file.complete && !file.uploading) {file.uploading = true;$data.uploads.current++;$data.uploads.attempted++;// Create a new AJAX requestxhr = file.xhr = new XMLHttpRequest();// Start the upload// Use the faster FormData if it existsif (typeof FormData === 'function' || typeof FormData === 'object') {// Create a new FormData objectvar formData = new FormData();// Add the form dataformData.append(settings.fileObjName, file);// Add the rest of the formDatafor (var i in settings.formData) {formData.append(i, settings.formData[i]);}// Open the AJAX callxhr.open(settings.method, settings.uploadScript, true);// On progress functionxhr.upload.addEventListener('progress', function(e) {if (e.lengthComputable) {$data.progress(e, file);}}, false);// On complete functionxhr.addEventListener('load', function(e) {if (this.readyState == 4) {file.uploading = false;if (this.status == 200) {if (file.xhr.responseText !== 'Invalid file type.') {$data.uploadComplete(e, file, uploadAll);} else {$data.error(file.xhr.responseText, file, uploadAll);}} else if (this.status == 404) {$data.error('404_FILE_NOT_FOUND', file, uploadAll);} else if (this.status == 403) {$data.error('403_FORBIDDEN', file, uploadAll);} else {$data.error('Unknown Error', file, uploadAll);}}});// Send the form data (multipart/form-data)xhr.send(formData);} else {// Send as binaryvar reader = new FileReader();reader.onload = function(e) {// Set some file builder variablesvar boundary = '-------------------------' + (new Date()).getTime(),dashes   = '--',eol      = '\r\n',binFile  = '';// Build an RFC2388 String binFile += dashes + boundary + eol;// Generate the headersbinFile += 'Content-Disposition: form-data; name="' + settings.fileObjName + '"';if (file.name) {binFile += '; filename="' + file.name + '"';}binFile += eol;binFile += 'Content-Type: application/octet-stream' + eol + eol;binFile += e.target.result + eol;for (var key in settings.formData) {binFile += dashes + boundary + eol;binFile += 'Content-Disposition: form-data; name="' + key + '"' + eol + eol;binFile += settings.formData[key] + eol;}binFile += dashes + boundary + dashes + eol;// On progress functionxhr.upload.addEventListener('progress', function(e) {$data.progress(e, file);}, false);// On complete functionxhr.addEventListener('load', function(e) {file.uploading = false;var status = this.status;if (status == 404) {$data.error('404_FILE_NOT_FOUND', file, uploadAll);} else {if (file.xhr.responseText != 'Invalid file type.') {    $data.uploadComplete(e, file, uploadAll);} else {$data.error(file.xhr.responseText, file, uploadAll);} }}, false);// Open the ajax requestvar url = settings.uploadScript;if (settings.method == 'get') {var params = $(settings.formData).param();url += params;}xhr.open(settings.method, settings.uploadScript, true);xhr.setRequestHeader("Content-Type", "multipart/form-data; boundary=" + boundary);// Trigger the uploadFile eventif (typeof settings.onUploadFile === 'function') {settings.onUploadFile.call($this, file);}// Send the file for uploadxhr.sendAsBinary(binFile);};reader.readAsBinaryString(file);}}};// Update a file upload's progress$data.progress = function(e, file) {var percent;if ($.inArray('onProgress', settings.overrideEvents) < 0) {if (e.lengthComputable) {percent = Math.round((e.loaded / e.total) * 100);}file.queueItem.find('.fileinfo').html(' - ' + percent + '%');file.queueItem.find('.progress-bar').css('width', percent + '%');}// Trigger the progress eventif (typeof settings.onProgress === 'function') {settings.onProgress.call($this, file, e);}};// Trigger an error$data.error = function(errorType, file, uploadAll) {if ($.inArray('onError', settings.overrideEvents) < 0) {// Get the error messageswitch(errorType) {case '404_FILE_NOT_FOUND':errorMsg = '404 Error';break;case '403_FORBIDDEN':errorMsg = '403 Forbidden';break;case 'FORBIDDEN_FILE_TYPE':errorMsg = 'Forbidden File Type';break;case 'FILE_SIZE_LIMIT_EXCEEDED':errorMsg = 'File Too Large';break;default:errorMsg = 'Unknown Error';break;}// Add the error class to the queue itemfile.queueItem.addClass('error')// Output the error in the queue item.find('.fileinfo').html(' - ' + errorMsg);// Hide the file.queueItem.find('.progress').remove();}// Trigger the error eventif (typeof settings.onError === 'function') {settings.onError.call($this, errorType, file);}file.skip = true;if (errorType == '404_FILE_NOT_FOUND') {$data.uploads.errors++;} else {$data.queue.errors++;}if (uploadAll) {methods.upload.call($this, null, true);}};// Trigger when a single file upload is complete$data.uploadComplete = function(e, file, uploadAll) {if ($.inArray('onUploadComplete', settings.overrideEvents) < 0) {file.queueItem.find('.progress-bar').css('width', '100%');file.queueItem.find('.fileinfo').html(' - Completed');file.queueItem.find('.progress').slideUp(250);file.queueItem.addClass('complete');}// Trigger the complete eventif (typeof settings.onUploadComplete === 'function') {settings.onUploadComplete.call($this, file, file.xhr.responseText);}if (settings.removeCompleted) {setTimeout(function() { methods.cancel.call($this, file); }, 3000);}file.complete = true;$data.uploads.successful++;$data.uploads.count++;$data.uploads.current--;delete file.xhr;if (uploadAll) {methods.upload.call($this, null, true);}};// Trigger when all the files are done uploading$data.queueComplete = function() {// Trigger the queueComplete eventif (typeof settings.onQueueComplete === 'function') {settings.onQueueComplete.call($this, $data.uploads);}};// ----------------------// Initialize UploadiFive// ----------------------// Check if HTML5 is availableif (window.File && window.FileList && window.Blob && (window.FileReader || window.FormData)) {// Assign an ID to the objectsettings.id = 'uploadifive-' + $this.attr('id');// Wrap the file input in a div with overflow set to hidden$data.button = $('<div id="' + settings.id + '" class="uploadifive-button">' + settings.buttonText + '</div>');if (settings.buttonClass) $data.button.addClass(settings.buttonClass);// Style the button wrapper$data.button.css({'height'      : settings.height,'line-height' : settings.height + 'px', 'overflow'    : 'hidden','position'    : 'relative','text-align'  : 'center', 'width'       : settings.width});// Insert the button above the file input$this.before($data.button)// Add the file input to the button.appendTo($data.button)// Modify the styles of the file input.hide();// Create a new input$data.createInput.call($this);// Create the queue containerif (!settings.queueID) {settings.queueID = settings.id + '-queue';$data.queueEl = $('<div id="' + settings.queueID + '" class="uploadifive-queue" />');$data.button.after($data.queueEl);} else {$data.queueEl = $('#' + settings.queueID);}// Add drag and drop functionalityif (settings.dnd) {var $dropTarget = settings.dropTarget ? $(settings.dropTarget) : $data.queueEl.get(0);$dropTarget.addEventListener('dragleave', function(e) {// Stop FireFox from opening the dropped file(s)e.preventDefault();e.stopPropagation();}, false);$dropTarget.addEventListener('dragenter', function(e) {// Stop FireFox from opening the dropped file(s)e.preventDefault();e.stopPropagation();}, false);$dropTarget.addEventListener('dragover', function(e) {// Stop FireFox from opening the dropped file(s)e.preventDefault();e.stopPropagation();}, false);$dropTarget.addEventListener('drop', $data.drop, false);}// Send as binary workaround for Chromeif (!XMLHttpRequest.prototype.sendAsBinary) {XMLHttpRequest.prototype.sendAsBinary = function(datastr) {function byteValue(x) {return x.charCodeAt(0) & 0xff;}var ords = Array.prototype.map.call(datastr, byteValue);var ui8a = new Uint8Array(ords);this.send(ui8a.buffer);};}// Trigger the oninit eventif (typeof settings.onInit === 'function') {settings.onInit.call($this);}} else {// Trigger the fallback eventif (typeof settings.onFallback === 'function') {settings.onFallback.call($this);}return false;}});},// Write some data to the consoledebug : function() {return this.each(function() {console.log($(this).data('uploadifive'));});},// Clear all the items from the queueclearQueue : function() {this.each(function() {var $this    = $(this),$data    = $this.data('uploadifive'),settings = $data.settings;for (var key in $data.inputs) {input = $data.inputs[key];limit = input.files.length;for (i = 0; i < limit; i++) {file = input.files[i];methods.cancel.call($this, file);}}// Trigger the onClearQueue eventif (typeof settings.onClearQueue === 'function') {settings.onClearQueue.call($this, $('#' + $data.settings.queueID));}});},// Cancel a file upload in progress or remove a file from the queuecancel : function(file, fast) {this.each(function() {var $this    = $(this),$data    = $this.data('uploadifive'),settings = $data.settings;// If user passed a queue item ID instead of file...if (typeof file === 'string') {if (!isNaN(file)) {fileID = 'uploadifive-' + $(this).attr('id') + '-file-' + file;}file = $('#' + fileID).data('file');}file.skip = true;$data.filesCancelled++;if (file.uploading) {$data.uploads.current--;file.uploading = false;file.xhr.abort();delete file.xhr;methods.upload.call($this);}if ($.inArray('onCancel', settings.overrideEvents) < 0) {$data.removeQueueItem(file, fast);}// Trigger the cancel eventif (typeof settings.onCancel === 'function') {settings.onCancel.call($this, file);}});},// Upload the files in the queueupload : function(file, keepVars) {this.each(function() {var $this    = $(this),$data    = $this.data('uploadifive'),settings = $data.settings;if (file) {$data.uploadFile.call($this, file);} else {// Check if the upload limit was reachedif (($data.uploads.count + $data.uploads.current) < settings.uploadLimit || settings.uploadLimit === 0) {if (!keepVars) {$data.uploads.attempted   = 0;$data.uploads.successsful = 0;$data.uploads.errors      = 0;var filesToUpload = $data.filesToUpload();// Trigger the onUpload eventif (typeof settings.onUpload === 'function') {settings.onUpload.call($this, filesToUpload);}}// Loop through the files$('#' + settings.queueID).find('.uploadifive-queue-item').not('.error, .complete').each(function() {_file = $(this).data('file');// Check if the simUpload limit was reachedif (($data.uploads.current >= settings.simUploadLimit && settings.simUploadLimit !== 0) || ($data.uploads.current >= settings.uploadLimit && settings.uploadLimit !== 0) || ($data.uploads.count >= settings.uploadLimit && settings.uploadLimit !== 0)) {return false;}if (settings.checkScript) {// Let the loop know that we're already processing this file_file.checking = true;skipFile = $data.checkExists(_file);_file.checking = false;if (!skipFile) {$data.uploadFile(_file, true);}} else {$data.uploadFile(_file, true);}});if ($('#' + settings.queueID).find('.uploadifive-queue-item').not('.error, .complete').size() === 0) {$data.queueComplete();}} else {if ($data.uploads.current === 0) {if ($.inArray('onError', settings.overrideEvents) < 0) {if ($data.filesToUpload() > 0 && settings.uploadLimit !== 0) {alert('The maximum upload limit has been reached.');}}// Trigger the onError eventif (typeof settings.onError === 'function') {settings.onError.call($this, 'UPLOAD_LIMIT_EXCEEDED', $data.filesToUpload());}}}}});},// Destroy an instance of UploadiFivedestroy : function() {this.each(function() {var $this    = $(this),$data    = $this.data('uploadifive'),settings = $data.settings;// Clear the queuemethods.clearQueue.call($this);// Destroy the queue if it was createdif (!settings.queueID) $('#' + settings.queueID).remove();// Remove extra inputs$this.siblings('input').remove();// Show the original file input$this.show()// Move the file input out of the button.insertBefore($data.button);// Delete the button$data.button.remove();// Trigger the destroy eventif (typeof settings.onDestroy === 'function') {settings.onDestroy.call($this);}});}};$.fn.uploadifive = function(method) {if (methods[method]) {return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));} else if (typeof method === 'object' || !method) {return methods.init.apply(this, arguments);} else {$.error('The method ' + method + ' does not exist in $.uploadify');}};})(jQuery);
//UploadiFive 1.2.3 上传插件结束var catid='{$typeid}';//变量后端传值var retype='{$retype}';function alltuku(){$("#other_tuku").toggle();
}function insert_alltuku(pic){//alert(pic);$.post("{:U('insert_alltuku')}", {'pic':pic,'catid':catid}, function(response2){if( response2 != 0 ){//	alert(1);var response3 = JSON.parse(response2);var response= response3.pic;	if($('#tuku1').attr('src') =='/Public/admin/images/nopic.png'){
$('#tuku1').prop('src', response);
$('#tuku1').prop('alt', response3.id);
$('#inputorder1').prop('value', response3.id);
$('#del_tuku1').show();
//alert('1插入完成:'+ $('#inputtuku1').val().length );
}else if
($('#tuku2').attr('src') =='/Public/admin/images/nopic.png'){
$('#tuku2').prop('src', response);
$('#tuku2').prop('alt', response3.id);
$('#inputorder2').prop('value', response3.id);
$('#del_tuku2').show();
}  else if
($('#tuku3').attr('src') =='/Public/admin/images/nopic.png'){
$('#tuku3').prop('src', response);
$('#tuku3').prop('alt', response3.id);
$('#inputorder3').prop('value', response3.id);
$('#del_tuku3').show();
} else if
($('#tuku4').attr('src') =='/Public/admin/images/nopic.png'){
$('#tuku4').prop('src', response);
$('#tuku4').prop('alt', response3.id);
$('#inputorder4').prop('value', response3.id);
$('#del_tuku4').show();
}  show_alert('成功！');	}else{//	alert(00);show_alert('失败');}});}$(function() {//自动填写已上传图片	var alltuku=[];var typeid=<?php echo $typeid>0?$typeid:0;?>;//	alert(typeid);$.post("{:U('get_tuku')}", {'typeid':typeid ,'retype':retype}, function(v){if( v == 0 ){show_alert('图片加载失败！');	}else{var alltuku = JSON.parse(v);//var response= response3.pic;let len = alltuku.length;
//alert('len:'+len);
for (let i = 1; i < (len+1); i++) {
$('#tuku'+i).prop('src', alltuku[i-1]['pic']);
$('#title'+i).prop('value', alltuku[i-1]['title']);
$('#tuku'+i).prop('alt', alltuku[i-1]['id']);
$('#inputorder'+i).prop('value', alltuku[i-1]['orderby']);
$('#del_tuku'+i).show();}	}});//$('#file_upload').click(function () {
//$('#hiddenclick').val(1);
//};//var button = document.getElementById("uploadifive-file_upload");
//button.addEventListener("click", function(e){
//alert("按钮被点击了！");
//});
<?php //$limit=5-$ii;
//echo "$('#limit').val(".$limit.");";$timestamp=time();?>//视频上传$('#file_upload_v').uploadifive({'auto'             : true,'checkScript'      : '?a=check_exists','fileType'         : '.mp4,.3gp,.avi,.rm,.wav,.acc','buttonText':'上传视频','formData'         : {'catid' : <?php echo $typeid>0?$typeid:0;?>,'cpinfo_id' : 0,'is_catid' : 1,//'timestamp' : '<?php echo $timestamp;?>',// 'token'     : '<?php echo md5('unique_salt' . $timestamp);?>'},// 'queueSizeLimit':{$limit},'queueSizeLimit':10,'queueID'          : 'fileQueue_v',//'queue'+{$v.id},'uploadScript'     : '{:U("uploadifive_v")}','onUploadComplete' : function(file, response) {
$('#video').val(response);video_source
$('#video_source').attr('src',response);
$('#video_see').attr('src',response);}});//多图上传
//if (window.performance.navigation.type !=2 ) {$('#file_upload').uploadifive({'auto'             : true,'async':false,'checkScript'      : '?a=check_exists','fileType'         : '.jpg,.jpeg,.png,.gif,.webp','formData'         : {'catid' : '{$typeid}','cpinfo_id' : 0,'isreturn' : window.performance.navigation.type,'timestamp' : '<?php echo $timestamp;?>','token'     : '<?php echo md5('unique_salt' . $timestamp);?>'},// 'queueSizeLimit':{$limit},'queueSizeLimit':4,'queueID'          : 'fileQueue',//'queue'+{$v.id},'uploadScript'     : '{:U("uploadifive")}','onUploadComplete' : function(file, response2) {if(response2==0){show_alert('数量超限,部分上传失败');console.log(response2);}else{var response3 = JSON.parse(response2);var response= response3.pic;//console.log(response);//alert( response);
if($('#tuku1').attr('src') =='/Public/admin/images/nopic.png'){
$('#tuku1').prop('src', response);
$('#inputorder1').prop('value', response3.id);
$('#del_tuku1').show();
//alert('1插入完成:'+ $('#inputtuku1').val().length );
}else if
($('#tuku2').attr('src') =='/Public/admin/images/nopic.png'){
$('#tuku2').prop('src', response);
$('#inputorder2').prop('value', response3.id);
$('#del_tuku2').show();
}  else if
($('#tuku3').attr('src') =='/Public/admin/images/nopic.png'){
$('#tuku3').prop('src', response);
$('#inputorder3').prop('value', response3.id);
$('#del_tuku3').show();
} else if
($('#tuku4').attr('src') =='/Public/admin/images/nopic.png'){
$('#tuku4').prop('src', response);
$('#inputorder4').prop('value', response3.id);
$('#del_tuku4').show();
}  
//alert($('#copy{$v.id}').val(),);
//setTimeout("window.location.reload()", 1500 )//console.log(data);
//alert(1);}}});//}});function change_order(id){var ids=$('#tuku'+id).attr('alt');var order=$('#inputorder'+id).val();$.post("{:U('change_order_tuku')}", {'ids':ids,'order':order}, function(v){if( v == 1 ){show_alert('修改成功！');	}else{show_alert('失败');}});}function change_title(id){var ids=$('#tuku'+id).attr('alt');var title=$('#title'+id).val();//alert(ids); alert(title);$.post("{:U('change_title_tuku')}", {'ids':ids,'title':title}, function(v){if( v == 1 ){show_alert('修改成功！');	}else{show_alert('失败');}});}	    //删除function del_tuku(id2){//show_alert(kid);//  if(!confirm('删除后无法恢复，确定删除？'))url=$('#tuku'+id2).attr('src');id=$('#tuku'+id2).attr('alt');//alert(alt);$.post("{:U('del_tuku')}", {url:url,id:id}, function(v){if( v == 1 ){show_alert('删除成功！');$('#tuku'+id2).prop('src','__PUBLIC__/admin/images/nopic.png');
//$('#inputtuku'+id).prop('value', '');
$('#inputorder'+id2).prop('value', '');
$('#del_tuku'+id2).hide();
//更新上传数量的限制
//$('#limit').val(parseInt($('#limit').val())+1);// $('#file_upload').data('uploadifive').settings.formData = { 'queueSizeLimit': $('#limit').val()};   //动态更改formData的值//	$('#file_upload').uploadifive('upload');}else{show_alert('失败');}});} </script></div>