ajax表单提交上传文件(异步上传与文本编辑器)
来源:互联网 发布:教育部网络教育 编辑:程序博客网 时间:2024/06/06 02:16
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
- ajax表单提交上传文件(异步上传与文本编辑器)
- 文件上传(表单上传和ajax异步上传)
- ajax异步表单提交,并实现文件上传
- Ajax表单提交上传文件
- Ajax提交form表单,Ajax文件上传
- ajax异步上传文件,ajax提交表单中的文件到后台解析
- jquery的异步提交表单(异步上传文件)及jquery.form.js上传文件注意事项
- 无刷新文件上传 ajax提交表单
- 无刷新文件上传 ajax提交表单
- 无刷新文件上传 ajax提交表单
- 表单上传文件提交实现ajax方式
- 使用ajax提交表单或上传文件
- SpringBoot+Ajax文件上传+FormData表单提交
- 多文件上传,ajax提交表单
- ajax异步上传文件(无需表单)
- 文件的上传(表单上传和ajax文件异步上传)
- 文件的上传(表单上传和ajax文件异步上传)
- Ajax提交form表单(包括文件上传)
- Hbase shell 常用命令
- spring 笔记1
- SMTP:防止追踪发件人IP
- 添加第三方类库造成的linker command failed with exit code 1 (use -v to see invocation)的错误
- Mac环境下svn的使用
- ajax表单提交上传文件(异步上传与文本编辑器)
- Implement strStr()
- Xcode 6制作动态及静态Framework
- SQLSERVER中如何快速比较两张表的不一样
- printf 和scanf 的使用范围
- mac上安装MySQL
- JAVA学习笔记(三十一)- 对象序列化Serializable
- java中线程阻塞之sleep、suspend、join、wait、resume、notify方法解析(一)
- 提高老人对养老服务的满意度