25、Ext JS的强大功能与应用实践

Ext JS的强大功能与应用实践

1. Ext JS的HtmlEditor组件

Ext JS包含一个出色的、功能有限的所见即所得（WYSIWYG）HtmlEditor组件，可直接嵌入表单中。以下是一个简单的示例代码：

Ext.onReady(function(){
  var formPanel = new Ext.form.FormPanel({
    title:'HtmlEditor Example',
    applyTo:'chap14_ex03',
    layout:'form',
    labelAlign:'top',
    width:600,
    autoHeight:true,
    frame:true,
    items:[{
      xtype:'htmleditor',
      id:'bio',
      fieldLabel:'Blog Entry',
      height:200,
      anchor:'98%'
    }]
  });
});

在这个示例中，我们将HtmlEditor组件嵌入到了FormLayout中进行快速演示。HtmlEditor应用于基本的文本区域，其工作方式与其他WYSIWYG编辑器（如FCKEditor或TinyMCE）类似。我们可以启用或禁用与格式设置相关的各种菜单按钮，调用各种方法（如获取或设置编辑器的文本、位置等），还可以应用事件监听器，就像使用Ext JS的其他组件一样。同时，它具有一致的Ext JS外观和感觉，用户可以直接在应用程序中格式化自己的内容。需要注意的是，HtmlEdi