在MVC3中使用富文本編輯器：KindEditor的配置及上傳圖片

現在比較常用的富文本編輯挺多的，如ueditor、fckeditor、kingeditor等，本文主要介紹一下KindEditor的配置與使用。

先去官網http://www.kindsoft.net/下載此編輯器的最新版本，比如現在的4.1.7版本，下載回來后，可以進行精簡，將一些用不到的文件或文件夾刪除。

一、將解壓出來的整個KindEditor4.1.7文件夾復制到項目的Content文件夾下，並重命名為kindeditor。

可以將asp、jsp、php、examples這四個文件夾直接刪除，沒有用處，只留下asp.net、attached、lang、plungins、themes這五個文件夾和其它的JS文件就行了。

注意：圖片上傳成功后，是放在attached這個文件夾中的。

二、將asp.net文件夾下，bin文件夾中的LitJSON.dll這個文件，復制到整個項目的bin文件夾中。

三、在需要放置編輯器的視圖，引入如下的文件以及配置

   <script type="text/javascript" src="@Url.Content("~/Content/kindeditor/kindeditor-min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Content/kindeditor/lang/zh_CN.js")"></script>
    <script type="text/javascript">
            var editor;
            KindEditor.ready(function (K) {
                editor = K.create('textarea[name="content"]', {
                    resizeType: 1,
                    allowFileManager : true,
                    uploadJson: '@Url.Content("~/Content/kindeditor/asp.net/upload_json.ashx")',
                    fileManagerJson:'@Url.Content("~/Content/kindeditor/asp.net/file_manager_json.ashx")'
               
                });
            });
    </script>

注意uploadJson: '@Url.Content("~/Content/kindeditor/asp.net/upload_json.ashx")',這一行是用來實現圖片上傳的。name="content"，這里的content就是你用來存放文章正文的表格字段名稱。

在需要放置編輯器的地方，加上代碼

@Html.TextAreaFor(m => m.content, new { style = "width:750px;height:400px" })

content替換成您自己的表格字段名，寬度和高度可變。

至此，編輯器配置完成，也可以上傳圖片哦。但是圖片的大小只能在1M以內。