核心提示:ueditor默认的文件管理可以单独拿出来使用,api很方便,但是没有提供对已上传文件的删除功能,下面简单整个删除功能,思路是通过ajax调用服务器端的ashx文件删除。前端修改html改动一切从简,...
ueditor默认的文件管理可以单独拿出来使用,api很方便,但是没有提供对已上传文件的删除功能,下面简单整个删除功能,思路是通过ajax调用服务器端的ashx文件删除。
前端修改
html改动
一切从简,就不给每个文件来个删除按钮了,直接双击删除,但是需要给个提示:
1.打开/ueditor/dialogs/attachment/attachment.html
2.找到id为tabhead的p,在它前面增加一个span标签:
双击删除文件
...
效果如下:
js改动
这里监听每个文件的双击事件,通过ajax调用服务器函数
1.打开/ueditor/dialogs/attachment/attachment.js
2.Ctrl+F搜索“选中”会定位到601行,如下:
/* 选中图片 */ domUtils.on(this.list, 'click', function (e) {...}
这是点击文件时的处理函数,现在要监听双击,只要在这个函数后面增加以下代码就可以:
/*双击删除*/ domUtils.on(this.list, 'dblclick', function (e) { $li = $(e.target).parents('li'); var path = $li.attr('data-url'); var name = path.substr(path.lastIndexOf('/') + 1); if (confirm('确定要删除' + name + '吗?此操作不可恢复')) { $.ajax({ url: '/Services/ueditor.ashx', data: { path: path }, success: function (data) { switch (data.Code) { case -1: case -2: case -3: alert(data.Msg); break; case 1: $li.remove(); break; default: alert('未识别的返回码:' + data.Code); console.log(data); break; } } }); } });
服务器端改动
1.根目录下创建一个Services文件夹,用来存放ashx文件(直接在根目录下创建ashx也可以)
2.创建一个名为ueditor.ashx的一般事务处理文件
3.返回数据结构:
public class JsonResult { ////// 状态码 /// -1 错误的请求 /// -2 系统错误 /// -3 未登录或权限不足 /// 1 成功 /// public int Code { get; set; } public string Msg { get; set; } }
4.处理函数
////// 根据请求删除文件 /// /// public void ProcessRequest(HttpContext context) { context.Response.ContentType = "application/json"; //验证权限 if (!context.User.IsInRole("管理员")) { context.Response.Write(JsonConvert.SerializeObject( new JsonResult { Code = -3, Msg="您无权进行此操作!" })); return; } //获取参数 string path = context.Request["path"]; path = "~" + path; string phyic = context.Server.MapPath(path); if (!File.Exists(phyic)) { context.Response.Write(JsonConvert.SerializeObject( new JsonResult { Code = -1, Msg="文件不存在!" })); return; } try { File.Delete(phyic); }catch(Exception e) { context.Response.Write(JsonConvert.SerializeObject( new JsonResult { Code = -2, Msg = "系统错误:"+e.Message })); return; } context.Response.Write(JsonConvert.SerializeObject( new JsonResult { Code=1, Msg="文件删除成功" })); }