asp图片多选后转base64后上传
1：前端
.file { position: relative; display: inline-block; border: 1px solid #68c08d; border-radius:4px; padding: 0px 12px; overflow: hidden; color: #39ac69; text-decoration: none; text-indent: 0; line-height:25px; } .file input { position: absolute; font-size: 100px; right: 0; top:2px; height:25px; opacity: 0; } .file:hover { border-color: #68c08d; color: #39ac69; text-decoration: none; }
<a href="javascript:;" class="file">选择文件 <input type="file" id="file" multiple="multiple" style="z-index: 999; position: absolute; cursor: pointer; bottom: 10px;" name="fileAttach" /></a>
window.onload = function(){ var input=document.getElementById("file"); if ( typeof(FileReader) === 'undefined' ){ input.setAttribute( 'disabled','disabled' ); } else { input.addEventListener( 'change',xmTanUploadImg,false );} } function xmTanUploadImg() { document.getElementById('validfile').value="0"; var obj=document.getElementById("file"); var fl = obj.files.length; for (var i = 0; i < fl; i++) { var file = obj.files[i]; //这里我们判断下类型如果不是图片就返回 去掉就可以上传任意文件 if(!/image\/\w+/.test(file.type)){ alert("请确保文件为图像类型"); return false; } var reader = new FileReader(); //读取文件过程方法 reader.onloadstart = function(e) { console.log("开始读取...."); } reader.onprogress = function(e) { console.log("正在读取中...."); } reader.onabort = function(e) { console.log("中断读取...."); } reader.onerror = function(e) { console.log("读取异常...."); } reader.readAsDataURL(file); reader.onload = function(e) { console.log("成功读取...."); var nDiv = document.getElementById('divnum').value; document.getElementById('divnum').value = parseInt(nDiv) + 1; var nValidFile = document.getElementById('validfile').value; document.getElementById('validfile').value = parseInt(nValidFile) + 1; var strimgId = 'img' + nDiv; var strfileId = 'file' + nDiv; var strsizeId = 'size' + nDiv; var strbzId = 'bz' + nDiv; var strtplxId = 'tplx' + nDiv; var strdivId = 'div' + nDiv; var strbtnId = 'btn' + nDiv; var strValueId='val' + nDiv; var strInputId='input' + nDiv;
//直接根据file的索引获取size是不准确的，reader.onload的中获取的size跟文件的顺序不一致，故只需根据文件的base64编码重新计算相关字节大小即可
var base64url=this.result var str = base64url.replace('data:image/jpeg;base64,', '');//这里根据自己上传图片的格式进行相应修改 str = str.replace('data:image/png;base64,', '');//这里根据自己上传图片的格式进行相应修改 var strLength = str.length; var fileLength = parseInt(strLength - (strLength / 8) * 2); // 由字节转换为KB var size = ""; size = parseInt(fileLength / 1024); document.getElementById("nSumFileSize").value=parseInt(document.getElementById("nSumFileSize").value)+size; var strhtm = '<div id="' + strdivId + '" class="PicDiv">'; strhtm = strhtm + '<div style="float:left;"><img onerror="this.src=\'/img/wfyl.gif\'" style="cursor:pointer;" id="' + strimgId + '" src="'+ e.target.result +'" width=100 height=100 align=absmiddle ></div>'; strhtm = strhtm + '<div class="RightDiv"><p><span class="inputtitle">大小</span><input class="inputnormal" value="'+size+'kb" style="width:50px;vertical-align: middle;" readonly id="' + strsizeId + '" name="' + strsizeId + '">'; strhtm = strhtm + '<span class="inputtitle">名称</span>'; strhtm = strhtm + '<select class="inputnormal width_query_k" id="'+strtplxId+'" name="'+strtplxId+'">'; strhtm = strhtm + strtplxsels; strhtm = strhtm + ' </select>'; strhtm = strhtm + '<span class="inputtitle">备注</span>'; strhtm = strhtm + '<textarea id="'+strInputId+'" name="'+strInputId+'" style="display:none">'+this.result+'</textarea>'; strhtm = strhtm + '<input class="inputnormal" style="width:200px;" id="'+strbzId+'" name="'+strbzId+'"><input type="hidden" name="'+strValueId+'" id="'+strValueId+'" value="havevalue">'; strhtm = strhtm + '<img src="/img/scbz1.gif" border=0 alt="删除" onclick="document.getElementById(\'nSumFileSize\').value =parseInt(document.getElementById(\'nSumFileSize\').value) -parseInt(document.getElementById(\''+strsizeId+'\').value);$(\'#' + strdivId + '\').remove();$(\'#' + strfileId + '\').remove();"></p>'; strhtm = strhtm + '</div>'; strhtm = strhtm + '</div>'; document.getElementById('MyFiles').insertAdjacentHTML("beforeEnd", strhtm); } } }
<% dbid=request.Cookies("sys")("DB_ID") divnum=request("divnum") bdlb=request("bdlb") bdbh=request("bdbh") dim Arr_tpmc() dim Arr_tpbz() dim Arr_tpdx() dim Arr_input() nFileSort=0 for i=0 to divnum strsize="size"&i strbz="bz"&i strtplx="tplx"&i strvalue="val"&i strinput="input"&i tpmc=request(strtplx) tpbz=request(strbz) tpdx=request(strsize) tpvalue=request(strvalue) base64=request(strinput) if tpvalue&""="havevalue" then ReDim Preserve Arr_tpmc(nFileSort) ReDim Preserve Arr_tpbz(nFileSort) ReDim Preserve Arr_tpdx(nFileSort) ReDim Preserve Arr_input(nFileSort) Arr_tpmc(nFileSort)=tpmc Arr_tpbz(nFileSort)=tpbz Arr_tpdx(nFileSort)=tpdx Arr_input(nFileSort)=base64 nFileSort=nFileSort+1 end if next nFileSort=0 savePath =GetPicFullPath() savePath=savePath&"/" set rs=server.createobject("adodb.recordset") sqltext="select top 1 * from tpgl" rs.open sqltext,dbcn,3,3 for filenum=0 to ubound(Arr_input) picname=savePath&GetNewPicName("1.jpg") picture=Trim(Arr_input(filenum)) picture=replace(picture,"data:image/png;base64,","") picture=replace(picture,"data:image/jpeg;base64,","") picture=replace(picture,"data:image/jpg;base64,","") xmlstr="<data>"&picture&"</data>" Dim xml : Set xml=Server.CreateObject("MSXML2.DOMDocument") Dim stm : Set stm=Server.CreateObject("ADODB.Stream") xml.resolveExternals=False xml.loadxml(xmlstr) xml.documentElement.setAttribute "xmlns:dt","urn:schemas-microsoft-com:datatypes" xml.documentElement.dataType = "bin.base64" stm.Type=1 'adTypeBinary stm.Open stm.Write xml.documentElement.nodeTypedValue stm.SaveToFile Server.MapPath(picname) stm.Close Set xml=Nothing Set stm=Nothing nFileSort=nFileSort+1 next erase Arr_tpmc erase Arr_tpbz erase Arr_tpdx rs.Close set rs=nothing call closedbcn %>
