jquery.uploadView 实现图片预览上传

2021-06-06 16:03

阅读：550

YPE html>

标签：xxx out 技术 height cto tap hmm func hang

图片上传，网上有好多版本，今天也要做一个查了好多最终找到了一个uploadview 进行了一下修改

来看代码

@{
    Layout = null;
}

"viewport" content="width=device-width" />
    Index
        class="shangchuan">
            示例
            class="js_uploadBox" style="position: relative">
                "preview" class="js_showBox">
                    "imghead" border="0" src="http://static.neihanhongbao.com/highads/images/nologo.jpg" alt="上传图片" style="width:100px; height:100px" />
                
                "file" name="file" id="id" style="position: absolute; top: 0px; left:0px; height: 100px; filter: alpha(opacity:0); opacity: 0; width: 100px" onclick="Upload()">
            
            "hidden" id="hidTmp_ID" name="Tmp_ID" value="" />

代码前台看起来很简单。

实现的效果也还可以，不过这个保存的是base64的图片，插入数据库的时候我们一般都是保存xxxx.jpg 故需要实现一个方法

 /// 
        /// base64转图片
        /// 
        /// 
        public static string BaseToImg(string baseimg) {
            byte[] bt = Convert.FromBase64String(baseimg.Replace("data:image/jpeg;base64,", ""));
            string filepath = "ImgServer".GetAppsetting();
            string sqlurl = @"" + DateTime.Now.ToString("yyyyMMdd") + "\\";
            string sqlname = "" + DateTime.Now.ToString("yyyyMMddhhmmssmsfff") + ".jpg";
            if (!System.IO.File.Exists(filepath + sqlurl)) {
                System.IO.Directory.CreateDirectory(filepath + sqlurl);
                System.IO.File.WriteAllBytes(filepath + sqlurl + sqlname, bt);
            }
            return sqlurl + sqlname;
        }