extjs 表单设置html5,ExtJS4.2学习(19)在线编辑器Ext.form.HtmlEditor

不知道大家发觉这样的问题没，以前写Extjs3.X的时候，Eclipse在复制粘贴写代码的时候一点不卡，在4.2的时候，用eclipse写就会经常卡死的现象。下午研究了一下午，我可不想在写代码的时候一直被卡死，我就找到了新的IDE工具intellij idea (关于此工具的介绍可以看我这篇文章http://www.shuyangyang.com.cn/jishuliangongfang/Javabiancheng/2013-12-04/186.html)，

下载好了之后发现使用起来好处多多，写Extjs4.2不卡了，腰不酸了，腿也不疼了，呵呵。。。最主要还有提示。

回归主题，今天看下在线编辑器控件，控件的属性如下：

Ext.form.field.HtmlEditor主要配置项配置项类型说明

createLinkTextString创建连接提示框中默认提示信息

defaultLinkValueString创建连接的默认值，默认为http://

defaultValueString编辑器默认值

enableAlignmentsBoolean是否启用左中右对齐按钮，默认为true

enableColorsBoolean是否启用前景色、背景色选择按钮，默认为true

enableFontBoolean是否启用选择字体按钮，默认为true

enableFontSizeBoolean是否启用增大缩小字体按钮，默认为true

enableFormatBoolean是否启用粗体、斜体、下划线按钮，默认为true

enableLinksBoolean是否启用创建连接按钮，默认为true

enableListsBoolean是否启用列表按钮，默认为true

enableSourceEditBoolean是否启用源代码编辑按钮，默认为true

fontFamiliesArray字体数组

buttonsTipsObject编辑器工具栏中按钮的提示信息配置对象组合，用来自定义工具栏提示消息

看下效果图：

主要代码如下：

Hello Extjs4.2

Ext.onReady(function(){

var htmlEditor = new Ext.form.HtmlEditor({

fieldLabel:'在线编辑器',

labelSeparator: "：",

createLinkText: "创建超链接",

defaultLinkValue: "http://",

enableAlignments: true,

enableColors: true,

enableFont: true,

enableFontSize: true,

enableFormat: true,

enableLinks: true,

enableLists: true,

enableSourceEdit: true,

fontFamilies: ["宋体", "隶书", "黑体"]

});

var form = new Ext.form.FormPanel({

title: '表单输入控件演示',

width:500,

frame: true,

items: [htmlEditor],

renderTo: 'form'

});

});

我的ExtJS4.2学习之路

---

作者：束洋洋

开始日期：2013年12月24日 21:39:47

深入浅出ExtJS之在线编辑器Ext.form.HtmlEditor

连载中，请大家继续关注！本文出自我的个人网站思考者日记网