layui(六)——upload组件常见用法总结

　　layui中提供了非常简单的文件上传组件，这里写了一个上传图片的栗子，上传成功后返回图片在服务器的路径，并设置为页面中img的src属性。因为上传十分简单，没什么可说的，就直接上代码了。

html代码

    <button type="button" class="layui-btn" id="test1">
        <i class="layui-icon">i>选择图片
    button>
    <button type="button" class="layui-btn" id="btnUpload">开始上传button>
    <img id="myPic" src="" width="500" />

JS代码

后台接口（使用.net mvc）

       public ActionResult UploadImg(string Parm1,string Parm2)
        {
            if (Request.Files.Count>0)
            {
                //p1,p2没什么用，只是为了证明前端中额外参数data{parm1,parm2}成功传到后台了
                string p1 = Parm1;
                string p2 = Parm2;
                //获取后缀名
                string ext = Path.GetExtension(Request.Files[0].FileName);
                //获取/upload/文件夹的物理路径
                string mapPath = Server.MapPath(Request.ApplicationPath);
                //通过上传时间来创建文件夹，每天的放在一个文件夹中
                string dir = mapPath + "upload/"+DateTime.Now.ToString("yyyy-MM-dd");
                DirectoryInfo dirInfo = Directory.CreateDirectory(dir);
                //在服务器存储文件，文件名为一个GUID
                string fullPath = dir + "/" + Guid.NewGuid().ToString()+ ext;
                Request.Files[0].SaveAs(fullPath);
                //获取图片的相对路径
                string imgSrc = fullPath.Replace(mapPath, "/");
                return Json(new { IsSuccess = 1, Msg = "上传成功", Src = imgSrc });
            }
            else
            {
                return Json(new { IsSuccess = 0, Msg = "上传失败", Src = "" });
            }
        }

 注：本文只是自己为了查看方便整理的一些内容，并不包含layui中所有内容，查看更多请访问官网http://www.layui.com/doc/modules/upload.html

转载于:https://www.cnblogs.com/wyy1234/p/9455154.html