ajax表单提交上传文件
采用一个JS插件也可以不用直接使用ajax中的表单提交事件。
js 插件名称:jquery-form.js 文本编辑器:ckeditor
JS代码:
$("#form1").ajaxSubmit({ type: "POST", url: "../../Info/ajax/ajaxToImgFile.ashx", success: function (data) { if (data == "0") { alert("上传文件失败,请核实文件是否存在!"); } else { var objValString = $.parseJSON(data); //json 解析成json对象 var isBool = "1"; //var a = objValString.NameType; switch (objValString.NameType) { case "jpg": isBool = "0"; break; case "png": isBool = "0"; break; case "gif": isBool = "0"; break; default: break; } if (isBool == "0") {//代表为图片了 CKEDITOR.instances.Content.insertHtml("<img src='" + objValString.NameFile + "' />"); } else { CKEDITOR.instances.Content.insertHtml("<a href='" + objValString.NameFile + "' >文件下载</a>"); } } }
注意一点:<form id="form1" action="" method="post" enctype="multipart/form-data"> 中必须加入enctype="multipart/form-data"
CS代码:
public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; //context.Response.Write(queryString); HttpPostedFile _upfile = context.Request.Files["btnfile"]; if (_upfile == null) { ResponseWriteEnd(context,"","4");//请选择要上传的文件 } else { string fileName = _upfile.FileName;//获取文件名 string suffix = fileName.Substring(fileName.LastIndexOf(".") + 1).ToLower();/*获取后缀名并转为小写: jpg*/ int bytes = _upfile.ContentLength;//获取文件的字节大小 //if (suffix != "jpg") // ResponseWriteEnd(context,"2"); //只能上传JPG格式图片 //if (bytes > 1024 * 1024) // ResponseWriteEnd(context,"3"); //图片不能大于1M string fileString = "/admin/FileLoad/file/" + DateTime.Now.ToString("yyyyMMddHHmmss") + "." + suffix; _upfile.SaveAs(HttpContext.Current.Server.MapPath(fileString));//保存图片 ResponseWriteEnd(context,fileString,suffix,"1"); //上传成功 } } /// <summary> /// /// </summary> /// <param name="context"></param> /// <param name="query">路径地址</param> /// <param name="key">文件后缀</param> /// <param name="msg">类型</param> private void ResponseWriteEnd(HttpContext context,string query,string key,string msg) { string str = "{"NameMsg":"" + msg + "","NameFile":"" + query + "","NameType":"" + key + ""}"; context.Response.Write(str); context.Response.End(); }
可以实现图片直接异步输入文本编辑器或者文件输入下载格式,调用此JS方法你直接拿一个按钮事件就可,实现下面的异步上传与文本编辑器操作
如果有不明白的可以加入本群:NET高级进阶族 369685243 (编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!
|