【在MVC中应用百度富文本编辑器】

1.下载.NET版本的百度富文本编辑器,前往 下载.NET版本百度富文本框 

2.解压下载的.zip压缩包,将utf8-.net文件夹名称改为:ueditor,复制到MVC根目录下面。结构如下:

【在MVC中应用百度富文本编辑器】_第1张图片

App_Code 上的文件是应用程序的源码

  • Config.cs 负责读取配置文件
  • Handler.cs 是请求处理器的基类,提供了一些基本对象的访问以及输出控制。如果需要增加处理器,应该从该基类继承
  • PathFormatter.cs 解析 PathFormat,把信息填充为运行时信息。
  • *Handler.cs 是各种处理器,处理各种 UEditor 需要的请求。

Bin 里面的是应用程序的依赖库,当前依赖 Newtonsoft 的 Json 库。Bin 目录和 App_Code 目录受应用程序保护,不用担心被用户访问到。

config.json 是 UEditor 后端的配置文件,上一节已经介绍了比较重要的配置项。

controller.ashx 是 UEditor 请求的入口,它把不同的 action 分发到不同的 Handler 来处理。

net.sln 是项目的解决方案文件,安装 Visual Studio 2013 或以上的机器可以打开进行项目的改造。

README.md 是本说明文件。

Web.config 是应用程序的配置文件

3.其他配置可以参照 百度富文本框官方文档

4.将index.html中的代码复制到Home控制器下的index试图,修改script链接的src:为其添加前缀~/ueditor/

    <script type="text/javascript" charset="utf-8" src="~/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="~/ueditor/ueditor.all.min.js"> </script>
    <script type="text/javascript" charset="utf-8" src="~/ueditor/lang/zh-cn/zh-cn.js"></script>
编译运行程序,效果如下,后端配置正常,可以实现所有功能。

【在MVC中应用百度富文本编辑器】_第2张图片


你可能感兴趣的:(mvc,文本编辑,百度富文本框)