语法高亮编辑器

• 从这里下载最新版本
• 下载最新源代码
• 在线演示

引言

我正在寻找一个支持语法高亮的在线代码编辑器，以便将其嵌入到我的CMS项目中。在尝试了几个现有的编辑器后，我发现没有一个让我满意。于是我决定自己构建一个，这就是它。

特点

• 这个编辑器是用AS3/Flash Builder 4编写的，它与任何安装了Flash播放器的浏览器兼容。
• 支持您键入时实时高亮显示。
• 扩展支持您需要的语言。目前，它支持C#/CSS/JS/VBS/HTML/XML。
• 支持在同一个文档中使用多种语言。通常，我们在单个ASP.NET页面中会有CSS/JS/C#/VB代码，这个编辑器可以以相应的样式高亮显示每个部分。
• 支持Tab键进行选定段落的缩进。
• 支持与JavaScript交互，编辑器暴露了友好的接口。

如何使用

要将此编辑器嵌入到您的页面中，第一步是正确加载此编辑器到您的页面。强烈建议使用 swfobject 加载编辑器。

<script language="javascript" type="text/javascript">
// initialize with parameters
var flashvars = {
    // indicate the parser, aspx / csharp /
    //       javascript / css / vbscript / html / xml
    parser: "aspx",
    
    // set the editor to read-only mode
    readOnly: false,    

    // the editor detects client installed fonts
    // and use preferred fonts if installed.
    // NOTE: the charactor '|' is required at the begin and end of the list
    preferredFonts : 
      "|Fixedsys|Fixedsys Excelsior 3.01|Fixedsys 
       Excelsior 3.00|Courier New|Courier|",

    // indicate the callback function so that we
    // can load the content into editor once it is initialized.
    onload : function() {
        // call setText to load content into editor
        document.getElementById('ctlFlash').setText( 
                 document.getElementById('content').value );
        document.getElementById('content').style.display = 'none';
    }
};

// flash player parameters, you can find more information
// at: http://code.google.com/p/swfobject/wiki/documentation
var params = { menu: "false", 
    wmode : "transparent", allowscriptaccess : "always" };

// define the id of the flash control, we need the id in javascript interaction 
var attributes = { id: "ctlFlash", name: "ctlFlash" };

// embed the flash with size, more information can be
// found at: http://code.google.com/p/swfobject/wiki/documentation
swfobject.embedSWF("CodeHighlightEditor.swf", 
  "flashContent", "800", "600", 
  "10.0.0", null, flashvars, params, attributes);
</script>

上面的示例代码演示了如何使用参数加载编辑器

• parser 指示解析器；解析器名称可以是 aspx / csharp / javascript / css / vbscript / html / xml / jsp / php / sql / cpp / java。
• readOnly 指示是否启用只读模式。
• preferredFonts 指示要在编辑器中使用的首选字体列表。编辑器检测客户端安装的字体，并使用列表中找到的第一个字体。列表项用字符 "|" 分隔，并且必须以 "|" 字符开头和结尾。
• onload 指示在编辑器初始化时要调用的回调函数。通常，您可以在此函数中将内容加载到编辑器中并隐藏实际的 textarea。

接口

• setParser(parseName:String)：动态切换解析器
• setReadOnly(readOnly:Boolean)：启用/禁用只读模式
• setText(content:String)：设置编辑器的内容
• getText()：获取编辑器的内容，通常用于在表单提交之前检索内容。