在线文本编辑器(一)—FreeTextBox

FreeTextBox是最常见的在线文本编辑器了，有诸多好处。

从官方网站http://freetextbox.com/上下载最新的版本，目前来讲最新的版本是4.0 Beta1，是Beta版，我下载了3.2.2版。

下载解压缩之后，内容如下：

介绍一下：

1. aspnet_client--存储的是FreeTextBox所用的各个风格的图片、css文件、JavaScript文件，当你的服务器不能正常的在常规模式下显示控件的时候，就需要使用外部资源模式来显示
2. Docs--FreeTextBox的详细地帮助文档
   
   如果想进行扩展开发等，就需要阅读一下这些。
3. examples--一些例子
4. Framework-1.1 2.0 3.0--分别是运用于不同版本下的.Net中的控件
5. readme.txt--介绍文档，稍后我会详细叙述这部分内容

现在让我们使用一下这个控件，做一个Demo，我用的是.net 3.5下的这个DLL。

新建项目，引用DLL，添加到工具栏之后，如图：

接下来就和其它控件的使用一样了，显示效果：

此处注意要将页面的ValidateRequest设置为不检测：ValidateRequest="false"，

也可以在web.config中进行配置：<pages validateRequest="false"></pages>。

FreeTextBox还有很多比较强大的功能，让我们阅读一下文档：

• 环境需要
  -.NET Framework 1.1，2.0，3.5
  -IIS 5.0，6.0，7.0
• 安装DLL
  1、根据.net版本，把相应的FreeTextBox.dll复制到bin目录下
  2、如果有授权文件，将FreeTextBox.lic也复制到bin目录下
• 安装FTB的支持文件
  FTB需要一些JavaScript、imgges、xml才能正确地使用，安装有两种方法
  1、内部资源-所有的这些文件其实都位于FreeTextBox.dll中，.net 2.0可以自动地获取，而.net 1.x需要手动设置一下web.config：
  <?xml version="1.0" encoding="utf-8" ?>
    <configuration>
     <system.web>
      <httpHandlers>
       <add verb="GET" path="FtbWebResource.axd" type="FreeTextBoxControls.AssemblyResourceHandler, FreeTextBox" />
      </httpHandlers>
     <system.web>
  <configuration>
  如果使用这种方法出错了，查看网页的源文件，看一下FtbWebResource.axd的引用位置，如果有明显的错误，根据实际情况修改一下web.config
  2、外部文件-如果不想使用内部方法，也可以使用外部文件的方式，默认的指向~/aspnet_client/FreeTextBox/。
      按照以下步骤：
  -首先设置FTB资源查找模式：JavaScriptLocation=ExternalFile, ToolbarImages=ExternalFile, ButtonImagesLocation=ExternalFile
  -然后指定文件夹位置：SupportFolder="/FreeTextBoxFiles/。
  设置如下：
      <FTB:FreeTextBox id="FreeTextBox1" SupportFolder="~/myfolder/FreeTextBox"
      JavaScriptLocation="ExternalFile"
      ToolbarImages="ExternalFile
      ButtonImagesLocation="ExternalFile"
      runat="server" />
• 使用FTB
  要想添加到asp.net页面上：
  1、添加引用：<%@ Register TagPrefix="FTB" Namespace="FreeTextBoxControls" Assembly="FreeTextBox" %>
  2、页面中适当的位置添加代码：<FTB:FreeTextBox id="FreeTextBox1" runat="Server" />
• 自定义FTB
  FTB本身有一些默认的按钮和下拉框在它的工具栏中的，如果想自定义，有三个方法可以使用：
  1、ToolbarLayout String
      这个属性接受一个字符串，这个字符串描述的是工具栏中的项，“，”用来隔开不同的项，“|”用来插入一个分隔符，“；”用来开始一个新的工具栏。
      默认的设置工具栏就是使用这些属性
      <FTB:FreeTextBox id="FreeTextBox1" ToolbarLayout="paragraphmenu,fontsizesmenu;bold,italic,underline| bulletedlist,numberedlist"      runat="Server" />
     还有一些可用的值，可以进行添加，同时还有一些属性只能用在Pro版本，官方网站给出详细介绍：http://freetextbox.com/features/
  2、Procedurally
      也可以像添加DataGrid中列的方法那样来添加工具栏，在这种情况下需要设置AutoGenerateToolbarLayoutFromString=false：
      <FTB:FreeTextBox id="FreeTextBox1" AutoGenerateToolbarsFromString="false" runat="server" >
              <Toolbars>
                  <FTB:Toolbar runat="server">
                      <FTB:ParagraphMenu runat="server" />
                      <FTB:FontSizesMenu runat="server" />
                  </FTB:Toolbar>
                  <FTB:Toolbar runat="server">
                      <FTB:Bold runat="server" />
                      <FTB:Italic runat="server" />
                      <FTB:Underline runat="server" />
                      <FTB:ToolbarSeparator runat="server" />
                      <FTB:BulletedList runat="server" />
                      <FTB:NumberedList runat="server" />
                  </FTB:Toolbar>
                  <FTB:Toolbar runat="server">
                      <FTB:InsertHtmlMenu runat="server">
                          <Items>
                              <FTB:ToolbarListItem Text="Cool1" Value="<b>lalala</b>" runat="server" />
                              <FTB:ToolbarListItem Text="Cool2" Value="<i>lalala</i>" runat="server" />
                              <FTB:ToolbarListItem Text="Cool3" Value="<u>lalala</u>" runat="server" />
                          </Items>
                      </FTB:InsertHtmlMenu>
                      <FTB:StyleMenu runat="server">
                          <Items>
                              <FTB:ToolbarListItem Text="Highlighed" Value="<b>Highlighed</b>" runat="server" />
                              <FTB:ToolbarListItem Text="SmallCaps" Value="<i>smallcaps</i>" runat="server" />
                          </Items>
                      </FTB:StyleMenu>
                  </FTB:Toolbar>
              </Toolbars>
          </FTB:FreeTextBox>
       (这种情况下我在编译的时候出现错误：未知的服务器标记“FTB:StyleMenu”，不知道这个是为什么，是不是和FTB的版本有关系)
  3、Code(后台代码方式)
  按钮和下拉框也可以通过代码设置，如果只想使用自己定义的工具栏，需要设置AutoGenerateToolbarsFromString=false。
  控件：<FTB:FreeTextBox id="FreeTextBox1" AutoGenerateToolbarsFromString="false" runat="server" />
  设置代码：
      void Page_Load(object Src, EventArgs E) {
      Toolbar toolbar1 = new Toolbar();
      toolbar1.Items.Add(new ParagraphMenu());
      toolbar1.Items.Add(new FontSizesMenu());

      FreeTextBox1.Toolbars.Add(toolbar1);

      Toolbar toolbar2 = new Toolbar();
      toolbar2.Items.Add(new Bold());
      toolbar2.Items.Add(new Italic());
      toolbar2.Items.Add(new Underline());
      toolbar2.Items.Add(new ToolbarSeparator());
      toolbar2.Items.Add(new BulletedList());
      toolbar2.Items.Add(new NumberedList());

      FreeTextBox1.Toolbars.Add(toolbar2);

      Toolbar toolbar3 = new Toolbar();
      StyleMenu styleMenu = new StyleMenu();
      styleMenu.Items.Add(new ToolbarListItem("Highlight","Highlight"));
      styleMenu.Items.Add(new ToolbarListItem("SmallCaps","smallcaps"));

      toolbar3.Items.Add(styleMenu);

      FreeTextBox1.Toolbars.Add(toolbar3);
  }

FTB还有其他一些特性和使用方法，目前我只有这么多研究，以后知道了新内容，再和大家分享。

转载于:https://www.cnblogs.com/baby_shark/archive/2009/05/05/1449599.html