您当前的位置: 首页 >  童心同萌

FileInput

童心同萌 发布时间:2018-08-05 15:28:36 ,浏览量:3

$(function(){
	initImageList();
	initCS1File1Img();
	initCS1File2Img();
	initCS1File3Img();
	initCS1File4Img();
	initCS1File5Img();
	syncBaseinfoImg();
	clickradio();
});

//定义回显图片数组
var Image1List = [];
var Image2List = [];
var Image3List = [];
var Image4List = [];
var Image5List = [];

/**
 * 初始化回显图片数组
 */
function initImageList(){
	if ($("#downUrl").val()) {
		Image1List.push(getImageByDownUrl($("#downUrl").val()));
//		$("#initCS1File1").fileinput("refresh",{initialPreview: Image1List});
	}
	if ($("#downUrl2").val()) {
		Image2List.push(getImageByDownUrl($("#downUrl2").val()));
//		$("#initCS1File2").fileinput("refresh",{initialPreview: Image2List});
	}
	if ($("#downUrl3").val()) {
		Image3List.push(getImageByDownUrl($("#downUrl3").val()));
//		$("#initCS1File3").fileinput("refresh",{initialPreview: Image3List});
	}
	if ($("#downUrl4").val()) {
		Image4List.push(getImageByDownUrl($("#downUrl4").val()));
//		$("#initCS1File4").fileinput("refresh",{initialPreview: Image4List});
	}
	if ($("#downUrl5").val()) {
		Image5List.push(getImageByDownUrl($("#downUrl5").val()));
//		$("#initCS1File5").fileinput("refresh",{initialPreview: Image5List});
	}
}

/**
 * 根据下载路径获取回显图片数组中的图片
 */
function getImageByDownUrl(downUrl){
	url = boot + '/common/downloadfilebyDownUrl.do?downUrl=' + downUrl;
	return '';
}

function initCS1File1Img() {
	$("#initCS1File1").fileinput({
		uploadUrl: boot + '/common/upload.do',
		maxFileCount: 1,
		maxFileSize: 100000,
		autoReplace: true,
		showClose: false,	//右上角小×
		showRemove: false,
		initialPreview: Image1List,	//回显图片
		layoutTemplates:{
			footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {delete} {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }, initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image1Id").val()}], //原图片点击删除图标后的请求路径 参数为附件id }).on("fileclear",function(event, data, msg){ //点击右上角小×或者Remove删除前 }).on("filecleared",function(event, data, msg){ //点击右上角小×或者Remove删除后 }).on('filepredelete', function(event, key, jqXHR, data) { //原图片点击删除图标前 }).on("filepreajax",function(previewId, index){ //点击Upload上传图片前 }).on("filebatchselected", function(event, files) { //选择文件后处理事件 //var oldCout = Image1List.length; //原图数量 //var currentCount = $("#initCS1File1").fileinput('getFilesCount'); //当前数量 //var newCount = $("#initCS1File1").fileinput('getFileStack').length; //新图数量 //debugger }).on('filedeleted', function(vKey, jqXHR, extraData){ //原图片点击删除图标后 clearImgId($("#image1Id").val()); //删除数据库中图片id的引用 $("#image1Id").val(""); //删除图片id $("#downUrl").val(""); //删除图片downUrl }).on('filepreremove', function(event, id, index) { //重新选择图片点击删除图标 if ($("#downUrl").val()) { //如果原来有图片则还原回原来的图片 //先获取图片然后刷新,否则刷新时可能图片还未成功获取 var img = getImageByDownUrl($("#downUrl").val()); setTimeout(function(){ $("#initCS1File1").fileinput("refresh",{initialPreview: img}); },1000); } }).on('fileuploaded', function (event, data, id, index) { //点击Upload上传图片后 //图片上传后点击删除图标无法真正将图片删除,因此上传后将删除图标隐藏 $("#initCS1File1").fileinput("refresh",{layoutTemplates:{ footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }}); var oldImgId = $("#image1Id").val(); var newImgId = data.response.id; $("#image1Id").val(newImgId); //更新图片id updateImgId(oldImgId,newImgId); //更新数据库中图片id的引用 deleteImageByid(oldImgId); //'最后'删除原图片 }); } function initCS1File2Img() { $("#initCS1File2").fileinput({ uploadUrl: boot + '/common/upload.do', maxFileCount: 1, maxFileSize: 100000, autoReplace: true, showClose: false, showRemove: false, initialPreview: Image2List, layoutTemplates:{ footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {delete} {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }, initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image2Id").val()}], }).on('filedeleted', function(vKey, jqXHR, extraData){ clearImgId($("#image2Id").val()); $("#image2Id").val(""); $("#downUrl2").val(""); }).on('filepreremove', function(event, id, index) { if ($("#downUrl2").val()) { var img = getImageByDownUrl($("#downUrl2").val()); setTimeout(function(){ $("#initCS1File2").fileinput("refresh",{initialPreview: img}); },1000); } }).on('fileuploaded', function (event, data, id, index) { $("#initCS1File2").fileinput("refresh",{layoutTemplates:{ footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }}); var oldImgId = $("#image2Id").val(); var newImgId = data.response.id; $("#image2Id").val(newImgId); updateImgId(oldImgId,newImgId); deleteImageByid(oldImgId); }); } function initCS1File3Img() { $("#initCS1File3").fileinput({ uploadUrl: boot + '/common/upload.do', maxFileCount: 1, maxFileSize: 100000, autoReplace: true, showClose: false, showRemove: false, initialPreview: Image3List, layoutTemplates:{ footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {delete} {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }, initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image3Id").val()}], }).on('filedeleted', function(vKey, jqXHR, extraData){ clearImgId($("#image3Id").val()); $("#image3Id").val(""); $("#downUrl3").val(""); }).on('filepreremove', function(event, id, index) { if ($("#downUrl3").val()) { var img = getImageByDownUrl($("#downUrl3").val()); setTimeout(function(){ $("#initCS1File3").fileinput("refresh",{initialPreview: img}); },1000); } }).on('fileuploaded', function (event, data, id, index) { $("#initCS1File3").fileinput("refresh",{layoutTemplates:{ footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }}); var oldImgId = $("#image3Id").val(); var newImgId = data.response.id; $("#image3Id").val(newImgId); updateImgId(oldImgId,newImgId); deleteImageByid(oldImgId); }); } function initCS1File4Img() { $("#initCS1File4").fileinput({ uploadUrl: boot + '/common/upload.do', maxFileCount: 1, maxFileSize: 100000, autoReplace: true, showClose: false, showRemove: false, initialPreview: Image4List, layoutTemplates:{ footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {delete} {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }, initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image4Id").val()}], }).on('filedeleted', function(vKey, jqXHR, extraData){ clearImgId($("#image4Id").val()); $("#image4Id").val(""); $("#downUrl4").val(""); }).on('filepreremove', function(event, id, index) { if ($("#downUrl4").val()) { var img = getImageByDownUrl($("#downUrl4").val()); setTimeout(function(){ $("#initCS1File4").fileinput("refresh",{initialPreview: img}); },1000); } }).on('fileuploaded', function (event, data, id, index) { $("#initCS1File4").fileinput("refresh",{layoutTemplates:{ footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }}); var oldImgId = $("#image4Id").val(); var newImgId = data.response.id; $("#image4Id").val(newImgId); updateImgId(oldImgId,newImgId); deleteImageByid(oldImgId); }); } function initCS1File5Img() { $("#initCS1File5").fileinput({ uploadUrl: boot + '/common/upload.do', maxFileCount: 1, maxFileSize: 100000, autoReplace: true, showClose: false, showRemove: false, initialPreview: Image5List, layoutTemplates:{ footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {delete} {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }, initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image5Id").val()}], }).on('filedeleted', function(vKey, jqXHR, extraData){ clearImgId($("#image5Id").val()); $("#image5Id").val(""); $("#downUrl5").val(""); }).on('filepreremove', function(event, id, index) { if ($("#downUrl5").val()) { var img = getImageByDownUrl($("#downUrl5").val()); setTimeout(function(){ $("#initCS1File5").fileinput("refresh",{initialPreview: img}); },1000); } }).on('fileuploaded', function (event, data, id, index) { $("#initCS1File5").fileinput("refresh",{layoutTemplates:{ footer: '
\n' + '
\n' + ' {progress} {actions}\n' + '
', actions: '
\n' + '
\n' + ' {zoom} {other}' + '
\n' + ' {drag}\n' + '
{indicator}
\n' + '
\n' + '
', }}); var oldImgId = $("#image5Id").val(); var newImgId = data.response.id; $("#image5Id").val(newImgId); updateImgId(oldImgId,newImgId); deleteImageByid(oldImgId); }); } /** * 将名义值对应的图片映射到baseinfo */ function syncBaseinfoImg(){ var cchm=$("#cchLength").val(); var cscch1height=$("#cscch1height").val(); var cscch2height=$("#cscch2height").val(); var cscch3height=$("#cscch3height").val(); var cscch4height=$("#cscch4height").val(); var cscch5height=$("#cscch5height").val(); if(parseFloat(cscch1height)==parseFloat(cchm)&&$("#downUrl").val()){ $("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl").val()); $("#imgDiv").css('display','block'); }else if(parseFloat(cscch2height)==parseFloat(cchm)&&$("#downUrl2").val()){ $("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl2").val()); $("#imgDiv").css('display','block'); }else if(parseFloat(cscch3height)==parseFloat(cchm)&&$("#downUrl3").val()){ $("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl3").val()); $("#imgDiv").css('display','block'); }else if(parseFloat(cscch4height)==parseFloat(cchm)&&$("#downUrl4").val()){ $("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl4").val()); $("#imgDiv").css('display','block'); }else if(parseFloat(cscch5height)==parseFloat(cchm)&&$("#downUrl5").val()){ $("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl5").val()); $("#imgDiv").css('display','block'); }else { $("#imgDiv").css('display','none'); } } /** * 设定单选框点击事件 */ function clickradio(){ $(":radio").click(function(){ for(var i=1;i
关注
打赏
1688896170
查看更多评论

童心同萌

暂无认证

  • 3浏览

    0关注

    87博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文
0.0481s