最近做項目要用文本編輯器,編輯器好多種,這里介紹KindEditor在asp.net mvc4中的使用方法。
一、准備工作:
1.下載KindEditor.去官網:http://www.kindsoft.net/
2.解壓,拷貝到項目中(這里面有些例子,可以先刪除掉在拷貝到項目中。)
二、使用步驟:
1.view頁面

<script> var editor; KindEditor.ready(function (K) { editor = K.create('textarea[id="content"]', {//textarea allowFileManager: true, //是否允許文件上傳 allowUpload: true, fileManagerJson: '/KindEditor/ProcessRequest', //瀏覽文件方法 uploadJson: '/KindEditor/UploadImage' //上傳文件方法 }); }); </script> TextArea: <div class="editor-field"> @Html.TextAreaFor(model => model.Content, new { id="content",style = "width:750px;height:400px" }) @Html.ValidationMessageFor(model => model.Content) </div>
2.Controller中定義方法,就是js中 fileManagerJson和uploadJson的執行方法

public class KindEditorController : Controller { [HttpPost] public ActionResult UploadImage() { string savePath = "/Content/UploadImages/"; string saveUrl = "/Content/UploadImages/"; string fileTypes = "gif,jpg,jpeg,png,bmp"; int maxSize = 1000000; Hashtable hash = new Hashtable(); HttpPostedFileBase file = Request.Files["imgFile"]; if (file == null) { hash = new Hashtable(); hash["error"] = 1; hash["message"] = "請選擇文件"; return Json(hash); } string dirPath = Server.MapPath(savePath); if (!Directory.Exists(dirPath)) { hash = new Hashtable(); hash["error"] = 1; hash["message"] = "上傳目錄不存在"; return Json(hash); } string fileName = file.FileName; string fileExt = Path.GetExtension(fileName).ToLower(); ArrayList fileTypeList = ArrayList.Adapter(fileTypes.Split(',')); if (file.InputStream == null || file.InputStream.Length > maxSize) { hash = new Hashtable(); hash["error"] = 1; hash["message"] = "上傳文件大小超過限制"; return Json(hash); } if (string.IsNullOrEmpty(fileExt) || Array.IndexOf(fileTypes.Split(','), fileExt.Substring(1).ToLower()) == -1) { hash = new Hashtable(); hash["error"] = 1; hash["message"] = "上傳文件擴展名是不允許的擴展名"; return Json(hash); } string newFileName = DateTime.Now.ToString("yyyyMMddHHmmss_ffff", DateTimeFormatInfo.InvariantInfo) + fileExt; string filePath = dirPath + newFileName; file.SaveAs(filePath); string fileUrl = saveUrl + newFileName; hash = new Hashtable(); hash["error"] = 0; hash["url"] = fileUrl; return Json(hash, "text/html;charset=UTF-8"); ; } public ActionResult ProcessRequest() { //根目錄路徑,相對路徑 String rootPath = "/Content/UploadImages/"; //根目錄URL,可以指定絕對路徑, String rootUrl = "/Content/UploadImages/"; //圖片擴展名 String fileTypes = "gif,jpg,jpeg,png,bmp"; String currentPath = ""; String currentUrl = ""; String currentDirPath = ""; String moveupDirPath = ""; //根據path參數,設置各路徑和URL String path = Request.QueryString["path"]; path = String.IsNullOrEmpty(path) ? "" : path; if (path == "") { currentPath = Server.MapPath(rootPath); currentUrl = rootUrl; currentDirPath = ""; moveupDirPath = ""; } else { currentPath = Server.MapPath(rootPath) + path; currentUrl = rootUrl + path; currentDirPath = path; moveupDirPath = Regex.Replace(currentDirPath, @"(.*?)[^\/]+\/$", "$1"); } //排序形式,name or size or type String order = Request.QueryString["order"]; order = String.IsNullOrEmpty(order) ? "" : order.ToLower(); //不允許使用..移動到上一級目錄 if (Regex.IsMatch(path, @"\.\.")) { Response.Write("Access is not allowed."); Response.End(); } //最后一個字符不是/ if (path != "" && !path.EndsWith("/")) { Response.Write("Parameter is not valid."); Response.End(); } //目錄不存在或不是目錄 if (!Directory.Exists(currentPath)) { Response.Write("Directory does not exist."); Response.End(); } //遍歷目錄取得文件信息 string[] dirList = Directory.GetDirectories(currentPath); string[] fileList = Directory.GetFiles(currentPath); switch (order) { case "size": Array.Sort(dirList, new NameSorter()); Array.Sort(fileList, new SizeSorter()); break; case "type": Array.Sort(dirList, new NameSorter()); Array.Sort(fileList, new TypeSorter()); break; case "name": default: Array.Sort(dirList, new NameSorter()); Array.Sort(fileList, new NameSorter()); break; } Hashtable result = new Hashtable(); result["moveup_dir_path"] = moveupDirPath; result["current_dir_path"] = currentDirPath; result["current_url"] = currentUrl; result["total_count"] = dirList.Length + fileList.Length; List<Hashtable> dirFileList = new List<Hashtable>(); result["file_list"] = dirFileList; for (int i = 0; i < dirList.Length; i++) { DirectoryInfo dir = new DirectoryInfo(dirList[i]); Hashtable hash = new Hashtable(); hash["is_dir"] = true; hash["has_file"] = (dir.GetFileSystemInfos().Length > 0); hash["filesize"] = 0; hash["is_photo"] = false; hash["filetype"] = ""; hash["filename"] = dir.Name; hash["datetime"] = dir.LastWriteTime.ToString("yyyy-MM-dd HH:mm:ss"); dirFileList.Add(hash); } for (int i = 0; i < fileList.Length; i++) { FileInfo file = new FileInfo(fileList[i]); Hashtable hash = new Hashtable(); hash["is_dir"] = false; hash["has_file"] = false; hash["filesize"] = file.Length; hash["is_photo"] = (Array.IndexOf(fileTypes.Split(','), file.Extension.Substring(1).ToLower()) >= 0); hash["filetype"] = file.Extension.Substring(1); hash["filename"] = file.Name; hash["datetime"] = file.LastWriteTime.ToString("yyyy-MM-dd HH:mm:ss"); dirFileList.Add(hash); } //Response.AddHeader("Content-Type", "application/json; charset=UTF-8"); //context.Response.Write(JsonMapper.ToJson(result)); //context.Response.End(); return Json(result, "text/html;charset=UTF-8", JsonRequestBehavior.AllowGet); } public class NameSorter : IComparer { public int Compare(object x, object y) { if (x == null && y == null) { return 0; } if (x == null) { return -1; } if (y == null) { return 1; } FileInfo xInfo = new FileInfo(x.ToString()); FileInfo yInfo = new FileInfo(y.ToString()); return xInfo.FullName.CompareTo(yInfo.FullName); } } public class SizeSorter : IComparer { public int Compare(object x, object y) { if (x == null && y == null) { return 0; } if (x == null) { return -1; } if (y == null) { return 1; } FileInfo xInfo = new FileInfo(x.ToString()); FileInfo yInfo = new FileInfo(y.ToString()); return xInfo.Length.CompareTo(yInfo.Length); } } public class TypeSorter : IComparer { public int Compare(object x, object y) { if (x == null && y == null) { return 0; } if (x == null) { return -1; } if (y == null) { return 1; } FileInfo xInfo = new FileInfo(x.ToString()); FileInfo yInfo = new FileInfo(y.ToString()); return xInfo.Extension.CompareTo(yInfo.Extension); } } }
3.最后在處理提交的Action上加 [ValidateInput(false)]特性,不然提交的報錯:從客戶端(“”)中檢測到有潛在危險的 Request.Form 值
參考:http://blog.163.com/very_apple/blog/static/277592362012111155310526/