MVC中使用Ueditor

時間 2019-11-24

標籤 mvc 使用 ueditor 简体版

原文原文鏈接

配置.net mvc4項目使用ueditor編輯器。javascript

一、首先下載Ueditor1.3.6開發版（http://ueditor.baidu.com/website/download.html）css

二、將下載的文件放在項目的Content文件夾下，也可放在其餘文件加下，但注意將下載的文件夾所有複製到項目中。html

三、項目中配置使用java

引入樣式文件web

<link href="~/Content/ueditor/themes/iframe.css" rel="stylesheet" />

引入JS文件mvc

 <script src="~/Content/ueditor/ueditor.config.js"></script>

<script src="~/Content/ueditor/ueditor.all.js"></script>

<script src="~/Content/ueditor/lang/zh-cn/zh-cn.js"></script>

<script src="~/Content/ueditor/ueditor.parse.js"></script>

使用文本編輯器的區域框

JS中初始化

 
      
       
       <script type 
       = 
       "text/javascript" 
       > 
       
        
       var editor 
       = 
       new baidu.editor.ui.Editor({ 
       
            UEDITOR_HOME_URL 
       : 
       '/Content/ueditor/', 
       //配置編輯器路徑 
       
            iframeCssUrl 
       : 
       '/Content/ueditor/themes/iframe.css', 
       //樣式路徑 
       
            
       // initialContent: "@Model.ArcContent",//初始化編輯器內容 
       
            autoHeightEnabled 
       : true, 
       //高度自動增加 
       
            minFrameHeight 
       : 
       500 
       //最小高度 
       
        }); 
       
        editor.render( 
       'ArcContent');//使用文本編輯器的元素 
       
       
       
        editor.ready( 
       function () { 
       
            
       var content 
       = 
       '@Html.Raw(Model.ArcContent)'; 
       
            editor.setContent(content); 
       
        }); 
       
  
       < 
       /script 
       >

數據保存及獲取顯示時注意事項編輯器

一、保存數據時，對的數據進行編碼 Server.HtmlEncode(cmsArc.ArcContent);函數

二、修改時返回數據時須要使用Server.HtmlDecode(cmsArc.ArcContent);對數據進行解碼ui

三、數據賦值時注意使用Html.Raw函數，否者數據會顯示爲Html標籤的形式。使用editor.ready(function(){})編碼

修改文件存儲的默認路徑及沒法上傳圖片和附件的處理辦法注意事項

1.把net文件夾下的image.ashx的頂部<%@ Assembly Src="Uploader.cs" %> 和<%@ Assembly Src="Config.cs" %>

2.把net文件夾下的 uploader.cs 上傳文件處理方法 public Hashtable upFile(HttpContext cxt, string pathbase, string[] filetype, int size) 的 pathbase = pathbase + "/"; 改成：pathbase = pathbase + DateTime.Now.ToString("yyyy-MM-dd") + "/";

3.在net文件夾下的 uploader.cs 上傳文件處理方法 public Hashtable upFile(HttpContext cxt, string pathbase, string[] filetype, int size) 的裏面加上 uploadpath =uploadpath.Replace("ueditor\\net","");

4. 在ueditor.config.js文件中，圖片上傳配置區把imagePath: URL + "net/" 改成： imagePath: URL.replace("ueditor/","")

五、下面是圖片管理配置：
ueditor.config.js文件中，圖片在線管理配置區把imageManagerPath: URL + "net/"改成： imageManagerPath: URL.replace("ueditor/", "")

imageManager.ashx 中，把 DirectoryInfo info = new DirectoryInfo(context.Server.MapPath(path));改成：DirectoryInfo info = new DirectoryInfo(context.Server.MapPath(path).Replace("ueditor\\net\\", ""));

來自爲知筆記(Wiz)